Different Ways to Crate an Array of Objects in JavaScript ?
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:
Table of Content
- Using Literals
- Using Array Constructor
- Using Push method
- Using Object Spread Syntax with concat
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) |
[ { 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); |
[ { 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) |
[ { 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); |
[ { key1: 'value1', key2: 'value2' }, { key1: 'value3', key2: 'value4' } ]
Contact Us