Javascript - How to shift objects inside an array of array

AdityaKumar
February 8, 2024
145 views
0 votes
2 Answers

I have data which is an array of arrays.
Each sub-array should hold a maximum of two objects.
I want to add an object (located at position a,b) within this data,
while ensuring that the overall structure remains intact.

If the count of objects is less than 2 within the sub-array
then the new object will be pushed to it.
Otherwise, all other objects will be shifted to the next position.
Can someone please help me write a function to achieve this in javascript/angular

The object to be added is –

var dataToAdd = [
    [
        {
            "name": "OneToThree",
            "data": {
                "value": 123
            }
        }
    ]
]

And array is –

var data = [
    [
        {
            "name": "firstName",
            "data": {
                "value": 1
            }
        },
        {
            "name": "secondName",
            "data": {
                "value": 2
            }
        }
    ],
    [
        {
            "name": "thirdName",
            "data": {
                "value": 3
            }
        },
        {
            "name": "fourthName",
            "data": {
                "value": 4
            }
        }
    ],
    [
        {
            "name": "fifthName",
            "data": {
                "value": 5
            }
        }
    ],
    [
        {
            "name": "sixthname",
            "data": {
                "value": 6
            }
        },
        {
            "name": "seventhName",
            "data": {
                "value": 7
            }
        }
    ]
]

In the above example, only one object is inside the third array. So I can add an object to this array. So, the third array will become –

[
    {
        "name": "fifthName",
        "data": {
            "value": 5
        }
    },
    {
        "name": "OneToThree",
        "data": {
            "value": 123
        }
    }
]

But if I add a new object to the 4th array (at second position, a= 4, b = 2), then the output should be –

var finalData = [
    [
        {
            "name": "firstName",
            "data": {
                "value": 1
            }
        },
        {
            "name": "secondName",
            "data": {
                "value": 2
            }
        }
    ],
    [
        {
            "name": "thirdName",
            "data": {
                "value": 3
            }
        },
        {
            "name": "fourthName",
            "data": {
                "value": 4
            }
        }
    ],
    [
        {
            "name": "fifthName",
            "data": {
                "value": 5
            }
        }
    ],
    [
        {
            "name": "sixthname",
            "data": {
                "value": 6
            }
        },
        {
            "name": "OneToThree",
            "data": {
                "value": 123
            }
        }
        
    ],
    [
        {
            "name": "seventhName",
            "data": {
                "value": 7
            }
        }
    ]
]

Answers

You can achieve this by creating a function that iterates over the data array and checks the length of each sub-array. If the length is less than 2, it adds the new object at the end of the sub-array. If the length is 2 or more, it inserts the new object at the specified position a, b and shifts the existing objects accordingly.

Demo:

function addObject(data, a, b, objectToAdd) {
    if (data[a - 1]) {
        if (data[a - 1].length < 2) {
            data[a - 1].push(objectToAdd);
        } else {
            data.splice(a, 0, []);
            data[a][0] = data[a - 1].pop();
            data[a][1] = objectToAdd;
        }
    } else {
        data.push([objectToAdd]);
    }
    return data;
}

var dataToAdd = [
    {
        "name": "OneToThree",
        "data": {
            "value": 123
        }
    }
];

var data = [
    [
        {
            "name": "firstName",
            "data": {
                "value": 1
            }
        },
        {
            "name": "secondName",
            "data": {
                "value": 2
            }
        }
    ],
    [
        {
            "name": "thirdName",
            "data": {
                "value": 3
            }
        },
        {
            "name": "fourthName",
            "data": {
                "value": 4
            }
        }
    ],
    [
        {
            "name": "fifthName",
            "data": {
                "value": 5
            }
        }
    ],
    [
        {
            "name": "sixthname",
            "data": {
                "value": 6
            }
        },
        {
            "name": "seventhName",
            "data": {
                "value": 7
            }
        }
    ]
];


// Adding object to 3rd array
var finalData1 = addObject(data, 3, 1, dataToAdd[0]);
console.log(finalData1);

// Adding object to 4th array at position 2
var finalData2 = addObject(data, 4, 2, dataToAdd[0]);
console.log(finalData2);

Considering that initial state of array is empty, it would be something like this

var data = [];
var i = 0;



function addObject(p1, p2) {
  const o = { "name": `name_${i}`, "data": { "value": i++ } };

  data[p1] ? data[p1].length < 2 ? 
                  data[p1].push(o)
                  : data[p1] = [...data[p1].slice(0, p2), o, ...data[p1].slice(p2, data[p1].length)]
             : data.push([o])
  
  console.log(data)
}

<button onClick="addObject(0,1)"> add </button>

Please signup or login to give your own answer.

Click here to cancel reply.

Javascript – How to shift objects inside an array of array

Answers