To convert an object to an array of objects in JavaScript, you can use any of the following methods –
- Use the Object.values() method to convert an object to an array of objects.
- Use the Object.keys() and map() method to convert an object to an array of objects.
- Use the Array.entries() and map() method to convert an object to an array of objects.
- Use the forEach() method to convert an object to an array of objects.
Let’s look at each of these methods in detail below.
Convert An Object To An Array Of Objects In JavaScript
1. Use the Object.values() method to convert an Object to an array of objects
The Object.values() method can be used to convert an object to an array of objects in JavaScript. This method returns an array of enumerable property values of the given object.
In the following example, we have an object and we use the Object.values() method to convert them to an array of objects.
var obj = {"student1″:{id:1, name:"John", marks:90}, "student2″:{id:2, name:"Smith", marks:80}};
console.log(Object.values(obj));
// Output
// [{ id: 1, name: ‘John’, marks: 90 } { id: 2, name: ‘Smith’, marks: 80 }]Note how the keys automatically get removed and we are only left with the values in the output.
2. Use the Object.keys() and map() method to convert an Object to an array of objects
Another way to convert an object to an array of objects in JavaScript is to use the Object.keys() and map() method. The Object.keys() method returns an array of enumerable property names of the given object.
In the following example, we have an object and we use the Object.keys() and map() method to convert them to an array of objects.
var obj = {"student1″:{id:1, name:"John", marks:90}, "student2″:{id:2, name:"Smith", marks:80}};
console.log(Object.keys(obj).map((key) => obj[key]));
// Output
// [{ id: 1, name: ‘John’, marks: 90 } { id: 2, name: ‘Smith’, marks: 80 }]In the above code, we first use the Object.keys() method to get an array of keys from our object and then we use the map() method to convert them to an array of objects.
3. Use the Array.entries() and map() method to convert an Object to an array of objects
If you want to maintain the key-value pairs while converting an object to an array of objects, you can use the Array.entries() and map() method.
The Array.entries() method returns an array of arrays whose elements are the enumerable string-keyed property values of the given object that are also accessible using Object.entries().
In the following example, we have an object and we use the Array.entries() and map() method to convert them to an array of objects.
var obj = {"student1″:{id:1, name:"John", marks:90}, "student2″:{id:2, name:"Smith", marks:80}};
console.log(Object.entries(obj).map((entry) => entry[1]));// Output
[{
id: 1,
marks: 90,
name: “John”
}, {
id: 2,
marks: 80,
name: “Smith”
}]
As you can see from the output, the key-value pairs are maintained while converting the object to an array of objects.
You can also use Object.entries() to create an array of objects with both the key and the value –
var obj = {"student1″:{id:1, name:"John", marks:90}, "student2″:{id:2, name:"Smith", marks:80}};
console.log(Object.entries(obj).map((entry) => {
return {[entry[0]]: entry[1]};
}));Output
[{
student1: {
id: 1,
marks: 90,
name: “John”
}
}, {
student2: {
id: 2,
marks: 80,
name: “Smith”
}
}]
4. Use the forEach() method to convert an Object to an array of objects
Another way to convert an object to an array of objects is to use the forEach() method. The forEach() method executes a provided function once per array element.
In the following example, we have an object and we use the forEach() method to convert them to an array of objects.
var obj = {"student1″:{id:1, name:"John", marks:90}, "student2″:{id:2, name:"Smith", marks:80}};
var arr = [];
Object.keys(obj).forEach((key) => {
arr.push(obj[key]);
});
console.log(arr);Output
[{
id: 1,
marks: 90,
name: “John”
}, {
id: 2,
marks: 80,
name: “Smith”
}]
As you can see from the output, we have successfully converted the object to an array of objects.
Conclusion
In this article, we looked at four different ways to convert an object to an array of objects in JavaScript. You can choose any of these methods depending on your needs and preferences.
I hope you found this article helpful. If you have any questions or comments, please feel free to post them below. Thanks for reading!