Open In App

Different Ways to Crate an Array of Objects in JavaScript ?

Last Updated : 08 Feb, 2024
Improve
Improve
Like Article
Like
Save
Share
Report

Objects in JavaScript are key-value pairs, making them suitable for representing structured data. Also, an array in JavaScript is a versatile data structure that can hold a collection of values. When dealing with objects, an array can be used to store multiple objects. An array of objects allows you to organize and manage multiple sets of related information. The key-value pairs in each object within the array represent the attributes or properties of the items being stored.

Below are the approaches used to create an array of objects in javascript:

Approach 1: Using Literals

This is most easiest way of creating array of objects. You directly define an array with objects using square brackets and curly braces.

Example: Here we will create an array of objects in JavaScript, where we create a fruit array having price and name of fruit as an object inside that.

Javascript




let fruits = [
  { name: 'Apple', price: 40 },
  { name: 'Banana', price: 20 },
  { name: 'Orange', price: 100 }
];
 
// printing the values of array
console.log(fruits)


Output

[
  { name: 'Apple', price: 40 },
  { name: 'Banana', price: 20 },
  { name: 'Orange', price: 100 }
]

Approach 2: Using Array Constructor

You can use the Array constructor to create an array of objects. However, the literal syntax is generally preferred. Array constructor can be created using ‘new’ keyword.

Example: Here, We will take an example to create array of objects using array constructor. we will create an array of cars and inside that we will create an objects having name and color.

Javascript




let cars = new Array(
  { name: 'Maruti', color: 'black' },
  { name: 'Audi', color: 'blue' },
  { name: 'Lamborghini', color: 'yellow' }
);
 
console.log(cars);


Output

[
  { name: 'Maruti', color: 'black' },
  { name: 'Audi', color: 'blue' },
  { name: 'Lamborghini', color: 'yellow' }
]

Approach 3: Using Push method

You can start with an empty array and use the push method to add objects dynamically. Array Push method simply add objects inside the define array.

Example: Here, we will take help of push method to create array of objects and create a array name students and inside that there is student name and age as an object.

Javascript




let student=[];
 
student.push({ name: 'Mahi', age: 24 });
student.push({ name: 'Nick', age: 23 });
student.push({ name: 'Joy', age: 22 });
 
console.log(student)


Output

[
  { name: 'Mahi', age: 24 },
  { name: 'Nick', age: 23 },
  { name: 'Joy', age: 22 }
]

Approach 4: Using Object Spread Syntax with concat

This method utilizes the concat method to concatenate multiple arrays, with each object being spread into individual elements of the array. It creates a new array containing all the objects specified.

Example: Here, we have used concat method to create array of objects.

Javascript




const arrayOfObjects = [].concat(
    { key1: 'value1', key2: 'value2' },
    { key1: 'value3', key2: 'value4' }
);
 
console.log(arrayOfObjects);


Output

[
  { key1: 'value1', key2: 'value2' },
  { key1: 'value3', key2: 'value4' }
]


Like Article
Suggest improvement
Share your thoughts in the comments

Similar Reads