How to Store an Object Inside an Array in JavaScript ?

Storing an object inside an array in JavScript involves placing the object as an element within the array. The array becomes a collection of objects, allowing for convenient organization and manipulation of multiple data structures in a single container. Following are the approaches through which it can be achieved.

Using spread Operator

The spread operator is used to add an object to an array by creating a shallow copy of the original array and appending the new object. This ensures the original array remains unchanged while incorporating the new element.

Syntax:

let variablename1 = [...value]; 

Example: In this example, we create an array myArray with two objects. It defines a new object newObj and uses the spread operator to add it to myArray, creating a newArray, which is then logged.

const myArray = [
  { name: "Rahul", language: "HTML" },
  { name: "Nikita", language: "Javascript" },
];

// Object to be added
const newObj = 
    { name: "Virat", language: "React" };

// Using the spread operator to add the 
// object to the array
const newArray = [...myArray, newObj];

console.log(newArray);

[
  { name: 'Rahul', language: 'HTML' },
  { name: 'Nikita', language: 'Javascript' },
  { name: 'Virat', language: 'React' }
]

Using Push() method

The push() method in JavaScript is utilized to add an object to the end of an array.

Syntax:

array.push(objectName)

Example: `myArray.push(newObj)` adds the object `newObj` to the end of the array `myArray`, dynamically expanding its length.

const myArray = [
  { name: "Rahul", language: "HTML" },
  { name: "Nikita", language: "Javascript" },
];

// Object to be added
const newObj = { name: "Virat", language: "React" };

myArray.push(newObj);

console.log(myArray);

[
  { name: 'Rahul', language: 'HTML' },
  { name: 'Nikita', language: 'Javascript' },
  { name: 'Virat', language: 'React' }
]

Using Splice Method

The `splice()` method in JavaScript can be used to store an object inside an array by specifying the starting index and deleting zero elements, then inserting the object.

Syntax:

arr.splice(index, 0, objectName)

Example: In this example, we define an array myArray with objects. It adds two new objects, newObj1 and newObj2, to the end of the array using the splice() method.

const myArray = [
  { name: "Rahul", language: "HTML" },
  { name: "Nikita", language: "Javascript" },
];

// Objects to be added
const newObj1 = 
    { name: "Virat", language: "React" };
const newObj2 = 
    { name: "Megha", language: "Redux" };

myArray.splice(myArray.length, 0, newObj1, newObj2);

console.log(myArray);

[
  { name: 'Rahul', language: 'HTML' },
  { name: 'Nikita', language: 'Javascript' },
  { name: 'Virat', language: 'React' },
  { name: 'Megha', language: 'Redux' }
]