You can initialize an array of objects in JavaScript using one of the two methods –
1. Using the fill() method
2. Using a for loop
Let’s look at both the methods in detail.
1. Using The fill() Method To Initialize An Array Of Objects In JavaScript
The fill() method can be used to fill an array with a static value or values from a start index to an end index.
For example, let’s say we have an array of objects named students as follows:
var students = new Array(2);
Now, we can initialize this array of objects using the fill() method as follows:
students.fill({name: "",age: 0},0,2);
console.log(students); //[ { name: "", age: 0 }, { name: "", age: 0 } ]
The above code will initialize the students array with two objects, each with properties name and age set to empty strings and 0 respectively.
Alternatively, we could have also initialized the objects in the students array using the following code:
students.fill({name: "John Doe",age: 20},0,2);
console.log(students); //[ { name: "John Doe", age: 20 }, { name: "John Doe", age: 20 } ]
This would have set the name property of both objects to “John Doe” and the age property to 20.
If you set the start and end parameters as 0 and 1 respectively, only the first object in the array will be initialized as follows:
students.fill({name: "John Doe",age: 20},0,1);
console.log(students); //[ { name: "John Doe", age: 20 }, <1 empty item> ]
If you do not set the start and end index parameters, the fill() method will fill the entire array with the static value or values.
For example, the following code would initialize all the objects in the students array:
students.fill({name: "John Doe",age: 20});
2. Using A for Loop To Initialize An Array Of Objects In JavaScript
A for loop can be used to initialize an array of objects.
For example, let’s say we have an array of objects named students as follows:
var students = new Array(2);
Now, we can initialize this array of objects using a for loop as follows:
for(var i=0;i<students.length;i++){
students = {name: "",age: 0};
}
console.log(students); //[ { name: "", age: 0 }, { name: ", age: 0 } ]
This would initialize the students array with two objects, each with properties name and age set to empty strings and 0 respectively.
Alternatively, we could have also initialized the objects in the students array using the following code:
for(var i=0;i<students.length;i++){
students = {name: "John Doe",age: 20};
}
console.log(students); //[ { name: "John Doe", age: 20 }, { name: "John Doe", age: 20 } ]
This would have set the name property of both objects to “John Doe” and the age property to 20.
Which Method Is Better?
There is no clear winner when it comes to choosing between the two methods to initialize an array of objects in JavaScript. It really depends on your specific needs.
If you need to initialize an array with a static value, then using the fill() method is probably the way to go.
However, if you need to initialize an array of objects with dynamic values, then using a for loop might be a better option.
Hope this helped!