How to convert Object’s array to an array using JavaScript ?
Last Updated :
27 Apr, 2020
Given an array of objects and the task is to convert the object values to an array with the help of JavaScript. There are two approaches that are discussed below:
Approach 1: We can use the map() method and return the values of each object which makes the array.
-
Example:
<!DOCTYPE HTML>
< html >
< head >
< title >
Convert a JS object to
an array using JQuery
</ title >
< script src =
</ script >
</ head >
< body style = "text-align:center;" >
< h1 style = "color:green;" >
GeeksForGeeks
</ h1 >
< p id = "GFG_UP" ></ p >
< button onclick = "myGFG()" >
Click Here
</ button >
< p id = "GFG_DOWN" ></ p >
< script >
var up = document.getElementById("GFG_UP");
var JS_Obj = {
1: ['gfg', 'Gfg', 'gFG'],
2: ['geek', 'Geek', 'gEEK']
};
up.innerHTML = "Object - ["
+ JSON.stringify(JS_Obj) + "]";
var down = document.getElementById("GFG_DOWN");
function myGFG() {
var array = $.map(JS_Obj, function (val, ind) {
return [val];
});
down.innerHTML = array;
}
</ script >
</ body >
</ html >
|
-
Output:
Approach 2: The Object.keys() method is used to get the keys of object and then those keys are used to get the values of the objects from the array.
-
Example:
<!DOCTYPE HTML>
< html >
< head >
< title >
Convert a JS object to
an array using JQuery
</ title >
< script src =
</ script >
</ head >
< body style = "text-align:center;" >
< h1 style = "color:green;" >
GeeksForGeeks
</ h1 >
< p id = "GFG_UP" ></ p >
< button onclick = "myGFG()" >
Click Here
</ button >
< p id = "GFG_DOWN" ></ p >
< script >
var up = document.getElementById("GFG_UP");
var JS_Obj = {
1: ['gfg', 'Gfg', 'gFG'],
2: ['geek', 'Geek', 'gEEK']
};
up.innerHTML = "Object - ["
+ JSON.stringify(JS_Obj) + "]";
var down = document.getElementById("GFG_DOWN");
function myGFG() {
var arr = Object.keys(JS_Obj)
.map(function (key)
{ return JS_Obj[key]; });
down.innerHTML = arr;
}
</ script >
</ body >
</ html >
|
-
Output:
Share your thoughts in the comments
Please Login to comment...