How to add multiple objects to a single array list in Javascript?

JavascriptFront End TechnologyObject Oriented Programming

Adding objects to the single array means appending new objects to the existing array list without removing or deleting any of the previously existing objects or elements.

There are multiple ways to add multiple objects to a single array list in JavaScript. We can use the functions like push() and splice() which directly append or add one or more objects to the existing single array list and we can use the spread operator.

Let see these one by one −

Using the push() function

The push() function in JavaScript adds elements or objects at the end of the array list.

Example

In this example, the usage of push() function to add multiple objects to a single array list is shown.

let arr = [100,'a']; console.log("array before adding anything") console.log(arr) arr.push('b') console.log("array after adding a single element using push() function:") console.log(arr) console.log("array after adding multiple objects using push() function:") arr.push(2020,'war','@1','d') console.log(arr)

The output when one or more objects are added to a single array list using push() function

Using the splice() function

The splice() function adds or deletes objects from the array. This takes three parameters −

  • The start index− Index from where the addition of elements should start.

  • Count of numbers to be deleted− Number of elements to be deleted from the index. (while using splice() for adding elements the second parameter should be ‘0’)

  • The objects− The objects which are to be added after the index mentioned should be given.

Example

This example shows the demonstration of using the splice() function to add objects to an array.

let arr = [100,'a']; console.log("array before adding anything") console.log(arr) console.log("Array after adding objects by using the splice() function:") arr.splice(arr.length,0,'b',23,'abcdef') console.log(arr)

The output when one or more objects are added to an array using splice() function

Using the spread operator

Using the JavaScript spread operator (…) you can expand and pass the elements of the iterable objects such as arrays, strings etc. as a sequence of values.

Example

This example explains how to add multiple objects to an array using the spread operator −

let arr = [100,'a']; console.log("array before adding anything") console.log(arr) arr = [...arr, 'b',10000,'abs'] console.log("array after adding objects using spread operator(...):") console.log(arr)

The output when one or more objects are added to an array using spread operator.

Declaring array as constant while using the spread operator

If used const for declaring an array while using spread operator it gives an error and cannot add objects into the array.

Example

In the following example we are tying to declare an array as a constant while using spread operator.

const arr = [13672, 783, 236, 3278]; console.log(arr) //Trying to add additional data arr = [...arr, 'this', 'is', 'additional', 'data'] console.log(arr)

This will generate an error.

Using the unshift() function

To add multiple objects at the start of an array, you can repeatedly call the unshift() function on it.

Example

Following is the example of this function −

let arr = []; arr.unshift(1); arr.unshift(2); console.log(arr);
raja
Updated on 06-Oct-2022 11:45:10

Advertisements