How to convert JSON object to JavaScript array?

I need to convert JSON object string to a JavaScript array.

This my JSON object:

{"2013-01-21":1,"2013-01-22":7}

And I want to have:

var data = new google.visualization.DataTable();
data.addColumn('string', 'Topping');
data.addColumn('number', 'Slices');


data.addRows([
['2013-01-21', 1],
['2013-01-22', 7]
]);

How can I achieve this?

675147 次浏览
var json_data = {"2013-01-21":1,"2013-01-22":7};
var result = [];


for(var i in json_data)
result.push([i, json_data [i]]);




var data = new google.visualization.DataTable();
data.addColumn('string', 'Topping');
data.addColumn('number', 'Slices');
data.addRows(result);

http://jsfiddle.net/MV5rj/

function json2array(json){
var result = [];
var keys = Object.keys(json);
keys.forEach(function(key){
result.push(json[key]);
});
return result;
}

See this complete explanation: http://book.mixu.net/node/ch5.html

If you have a well-formed JSON string, you should be able to do

var as = JSON.parse(jstring);

I do this all the time when transfering arrays through AJAX.

Suppose you have:

var j = {0: "1", 1: "2", 2: "3", 3: "4"};

You could get the values with (supported in practically all browser versions):

Object.keys(j).map(function(_) { return j[_]; })

or simply:

Object.values(j)

Output:

["1", "2", "3", "4"]

As simple as this !

var json_data = {"2013-01-21":1,"2013-01-22":7};
var result = [json_data];
console.log(result);

This will solve the problem:

const json_data = {"2013-01-21":1,"2013-01-22":7};


const arr = Object.keys(json_data).map((key) => [key, json_data[key]]);


console.log(arr);

Or using Object.entries() method:

console.log(Object.entries(json_data));

In both the cases, output will be:

/* output:
[['2013-01-21', 1], ['2013-01-22', 7]]
*/

The above solutions do not work for nested objects. For nested objects, we can do something like this:

const isObject = (obj) => {
return typeof obj === 'object' && !Array.isArray(obj) && obj !== null;
}


const objToArray = (obj) => {
return Object.keys(obj).map((key) => {
return [
key, isObject(obj[key]) ?
objToArray(obj[key]) :
obj[key]
];
});
}


const json_data = {
"2013-01-21":1,
"2013-01-22":7,
"ab":{"x":{"xa": 3, "xb": 4}, "y": 2},
};


console.log(JSON.stringify(objToArray(json_data)));

The output in this case will be:

/* output:
[["2013-01-21",1],["2013-01-22",7],["ab",[["x",[["xa",3],["xb",4]]],["y",2]]]]
*/

You can insert object items to an array as this


let obj2 = {"2013-01-21":1,"2013-01-22":7}
 

console.log(Object.keys(obj2).map(key => [key, obj2[key]]))


let obj = {
'1st': {
name: 'stackoverflow'
},
'2nd': {
name: 'stackexchange'
}
};


// you can use Object.values(obj)
console.log(Object.values(obj))
 

// or you can use this instead.
let wholeArray = Object.keys(obj).map(key => obj[key]);


 

console.log(wholeArray);
console.log(Object.values(obj));

const json = '{"result":true, "count":42}';
const obj = JSON.parse(json);


console.log(obj.count);
// expected output: 42


console.log(obj.result);
// expected output: true

Consider having a json object we want to convert

const my_object = {
"key1": "value1",
"key2": "value2",
"key3": "value3"
}

There is several solution you can use :

1. Object.keys() and Object.values()

Theses functions convert any object to an array. One returns an array with all the keys, and the other all the values :

console.log(Object.keys(my_object))
// Output : ["key1", "key2", "key3"]


console.log(Object.values(my_object))
// Output : ["value1", "value2", "value3"]

I'm not sure to understand the initial question, but the solution would probably be

data.addRows(Object.values(my_object));

2. Object.entries()

This function is a mix of the two above:

console.log(Object.entries(my_object))
// Output : [["key1", "value1"],  ["key2", "value2"],  ["key3", "value3"]]

It no use for the initial question, but this function is so usefull I had to mention it. Especially, when the value_ are nested object. Let say our values are objects like this :

const my_object = {
"key1": {"a": 1, "b": 2},
"key2": {"y": 25, "z": 26},
"key3": {"much": "stuff"}
}

and we want to end up with an array like this

my_array = [
{"key": "key1", "a": 1, "b": 2},
{"key": "key2", "y": 25, "z": 26},
{"key": "key3", "much": "stuff"}
]

We need to use Object.entries() to get all our key with their value. We will start with an overdetailed code :

my_array = Object.entries(my_object).map(function(entry){
key = entry[0];
value = entry[1];


nested_object = value;
nested_object.key = key;


return nested_object;
});


console.log(my_array);
// Expected output : [
//    {"key": "key1", "a": 1, "b": 2},
//    {"key": "key2", "y": 25, "z": 26},
//    {"key": "key3", "much": "stuff"}
//]

We can make use of spread operator to simplify our code :

my_array = Object.entries(my_object).map(entry => {"key": entry[0], ...entry[1]});


console.log(my_array);
// Expected output : [
//    {"key": "key1", "a": 1, "b": 2},
//    {"key": "key2", "y": 25, "z": 26},
//    {"key": "key3", "much": "stuff"}
//]

Some correction to @Mister Aqua's SOLUTION

const my_array = [];
Object.entries(set_of_objects).map(function (entry) {
const key = entry[0];
const value = entry[1];


const nested_object = {};


nested_object[key] = value;
my_array.push(nested_object);
});

Chill Pill :)

if the goal is to create an array of objects, here is a solution that will accomplish what you're trying to do using Object.keys():

const jsonResponse = '{"2013-01-21":1,"2013-01-22":7}'
// Only use json parse if the data is a JSON string.
const obj = typeof jsonResponse === 'string' ? JSON.parse(jsonResponse) : jsonResponse;
const data = [];


Object.keys(obj).forEach((key) => data.push({[key]: obj[key]}))
// Example 2 - storing it directly in a variable using map
const arrayOfObjs = Object.keys(obj).map((key) => ({[key]: obj[key]}))

Or using Object.entries()

// Example 1
Object.entries(obj).forEach((array) => data.push({[array[0]]: array[1]}))
// Example 2
Object.entries(obj).forEach(([key, value]) => data.push({[key]: value}))
// Example 3 - Store it directly in a new variable using map
const arrayOfObjs = Object.entries(obj).map(([key, value]) => ({[key]: value}))

i got this error when i put my long JSON string in a hidden div and then tried to convert it to JSON by this code-

var data = document.getElementById('data');
var json = JSON.parse(data);

spotted error yet? yes, i forgot to add .innerHTML in first line. so data is already an object. not a string. how can a object be parsed by JSON.parse?

JSON.parse is made for parsing strings. not objects.