5 Ways Add Object To Array Javascript

In this article, we are going to learn how Javascript push object to array in 5 different ways with examples.

JavaScript array can store multiple data types. For example, we can store numbers, strings, booleans, arrays, and objects as well.

An array of objects is generally used to store real-life data. For example, we can store user data, product data, and so on.

Let's see how we can add object to array in Javascript.

Table Of Contents

1. Using push() method
2. Using unshift() method
3. Using splice() method
4. Assign object to array
5. Using Spread operator

1. Javascript push object to array using push() method

The push() is the most famous array method in JavaScript. It is used to add an element to the end of an array.

This can be used to add any data type to an array. For example, we can add a string, number, boolean, object, array, etc. to an array.

The push() method accepts one or more arguments. The arguments are added to the end of the array.

To add an object to array using push() method pass the reference of an object or direct object as an argument to the method.

Add the object to an array using push()

let arr = [1, 2];

let obj = {
  name: "John",
  age: 30
};

// push object to array
arr.push(obj);
console.log(arr);

After running the code, you can see the object is pushed to the end of the array.

You can also directly pass an object to the push() method.

let arr = [1, 2];

// push object to array
arr.push({
  name: "John",
  age: 30
});
console.log(arr);

You can also add multiple objects to the array using the push() method. Pass multiple objects to the method by separating them with a comma.

let arr = [1, 2];
let obj1 = {
  name: "John",
  age: 30
};
let obj2 = {
  name: "Peter",
  age: 40
};

arr.push(obj1, obj2);
console.log(arr);

2. Javascript push object to array using unshift() method

The unshift() is another array method that can be used to add any object to the array.

The unshift() method accepts one or more arguments and adds them to the beginning of the array.

You can also add an object to the array by passing reference of the object to the methods or by directly passing the object to the method.

Add the object to an array using unshift()

// add object to array javascript
let arr = [1, 2];
let obj = {
  name: "John",
  age: 30
};

arr.unshift(obj);
console.log(arr);

You can also add multiple objects by passing multiple objects to the method and separating them with a comma.

let arr = [1, 2];
let obj1 = {
  name: "John",
  age: 30
};
let obj2 = {
  name: "Peter",
  age: 40
};

arr.unshift(obj1, obj2);
console.log(arr);

3. Javascript push object to array using splice() method

The splice() is a very powerful method. It can add or remove any element at any position in an array.

It accepts three arguments.

1. Index - The position where the element is to be added or removed.
2. How many elements are to be removed - The number of elements to be removed from the array.
3. What to be added - The element to be added to the array.

To add an element number of elements to remove would be 0.

let arr = [1, 2, 3];
let obj = {
  name: "John",
  age: 30
};

// add object to array at index 2
arr.splice(2, 0, obj);
console.log(arr);

The splice() method can also accept multiple arguments. After 2nd argument, any number of arguments passed to the method is added to the array.

let arr = [1, 2, 3];
let obj1 = {
  name: "John",
  age: 30
};
let obj2 = {
  name: "Peter",
  age: 40
};

// add 2 objects to array at index 2
arr.splice(2, 0, obj1, obj2);
console.log(arr);

4. Add object by assigning to array

A new element can be added to an array by assigning the element to the array at a particular index.

For example, arr[0] = "John"; will add "John" to the first index of the array.

Similarly, you can assign an object to an array using this method.

let arr = [1, 2, 3];
let obj = {
  name: "John",
  age: 30
};

arr[0] = obj;
console.log(arr);

5. Javascript push object to array using spread operator

In general, the spread operator is used to expand the elements of an array into a list of arguments. But we can use it to add elements to the array.

Spread the array in a square bracket and add the object as the next argument.

let arr = [1, 2, 3];
let obj = {
  name: "John",
  age: 30
};

arr = [...arr, obj];
console.log(arr);

Conclusion

In this short guide, we looked at 5 ways to add object to array javascript.

The 5 methods are push(), unshift(), splice(), assign method and spread operator.