Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
Physics
Chemistry
Biology
Mathematics
English
Economics
Psychology
Social Studies
Fashion Studies
Legal Studies
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
How to convert Object’s array to an array using JavaScript?
We can use the Object.values() method, Array puch() method and for…of loop to convert Object’s array to an array using JavaScript. First we access each object using for…of loop and then apply the Object.values() method to access the values of individual object. Then use the Array push() method to add the values to the array. In this article, we will discuss in this approach in detail.
Let’s have a look at the example to get an understanding about the problem.
You have given an array of objects and the task is to convert the array of object into array of object’s values. Here is the example of what we want to achieve.
Given Array of Object −
let carObj = [ { name: "John", car: "Ford" }, { name: "Mark", car: "BMW" }, { name: "Ben", car: "Toyota" } ]
Should Be converted to −
let carObj = ["John", "Ford", "Mark", "BMW", "Ben", "Toyota" ]
There are multiple ways to achive this. Some of them are −
Using for...of loop
Using array.map method
Using for…of loop
The for…of loop is used to iterate through the values of the array or any iterable object. To convert an array of object to an array using for...of loop we use the following Steps.
Steps
Create an empty in which we store the resulting values.
Loop through the array of object using for...of loop
As we know the items of the array are object whose values we want.
Push the values of the current object into the empty array by array.push and Object.values() methods.
Example
In this example we have an array of objects. Those objects contains the name and car modal. We are extracting those values and assigning them in a single array using for..of loop.
<html>
<head>
<title>How to convert Object’s array to an array using JavaScript?</title>
</head>
<body>
<h3 id="demo">Converting Object’s array to an array using for...of loop</h3>
<script>
// The car object
let carObj = [
{ name: "John", car: "Ford" },
{ name: "Mark", car: "BMW" },
{ name: "Ben", car: "Toyota" }
]
// Initialize an empty array
let arr = [];
// Loop through the car object
for (i of carObj) {
// Push the values of every object into arr
arr.push(...Object.values(i))
}
// Print the arr
document.write("Final Array: " + arr)
</script>
</body>
</html>
Using Array.map() Method
The Array.map() method is calls a function on every elements of the array and then returns a new array. To convert array of object to an array using Array.map() method we use the following Steps.
Apply the map method on the array of object.
After every iteration return the value of the key that you want to extract.
You will get an array of the all the values of the particular key.
Example
In this example we have an array of objects. Those objects contain the name and car modal. We are extracting the all the cars in a separate array and all the names in a separate Array.
<html>
<head>
<title>Example- How to convert Object's array to an array using JavaScript</title>
</head>
<body>
<h3 id="demo">Converting Object's array to an array using Array.map() method</h3>
<script>
// The car object
let carObj = [
{ name: "John", car: "Ford" },
{ name: "Mark", car: "BMW" },
{ name: "Ben", car: "Toyota" }
]
let nameArr = carObj.map((item) => item.name)
let carArr = carObj.map((item) => item.car)
// Print the Arrays
document.write("Names Array : " + nameArr + "<br>")
document.write("Cars Array : " + carArr)
</script>
</body>
</html>
6K+ Views
