I have an object like this:
{
"A": [ "-4927","8779","-9971","-23767" ],
"B": [ "-10617","-1456","3131","259" ],
"C": [ "-5185","1168","21501","18989" ],
"D": [ "2010","5664","2148","-674" ]
}
I want to convert to this:
[
{
name: 'A',
data: ["-4927","8779","-9971","-23767"]
}, {
name: 'B',
data: ["-10617","-1456","3131","259"]
}, {
name: 'C',
data: ["-5185","1168","21501","18989"]
}, {
name: 'D',
data: ["2010","5664","2148","-674"]
}
]
I have used this following method:
var newData = [];
$.each($.parseJSON(data), function(k, v) {
newData['name'] = k;
newData['data'] = v;
});
But it only store the last key pair value as newData. That is
name: 'D',
data: ["2010","5664","2148","-674"]
I understand that it overwrite the previous data and store only the last data it get. But i can't solve this problem.
Any Help ?
You are assigning the properties name
and data
directly to newData
instead of pushing an object into it as an array:
Change your loop to this:
var newData = [];
$.each($.parseJSON(data), function(k, v) {
const myNewData = {
name: k,
data: v
}
newData.push(myNewData);
});
You can do this using map
const oldData = { "A": [ "-4927","8779","-9971","-23767" ] , "B": [ "-10617","-1456","3131","259" ] , "C": [ "-5185","1168","21501","18989" ] , "D": [ "2010","5664","2148","-674" ] } const newShape = ([ name, data ]) => ({ name, data }) const newData = Object.entries(oldData).map(newShape) console.log(newData) // [ { name: "A", data: [ "-4927","8779","-9971","-23767" ] }, ... ]
You can write the lambda inline, if you wish, but it's generally better to write programs with reusable pieces
const newData =
Object.entries(oldData).map(([ name, data ]) => ({ name, data }))
jQuery can map over objects using $.map – note the differing lambda
const newData =
$.map(oldData, (data, name) => ({ name, data }))
You can use of Object.keys
and Array.map
to generate your array.
It can be translated to this:
for each key in my object data, create a new item inside of a new array. This item is going to be an object, with a key name and a key data.
const data = { A: ['-4927', '8779', '-9971', '-23767'], B: ['-10617', '-1456', '3131', '259'], C: ['-5185', '1168', '21501', '18989'], D: ['2010', '5664', '2148', '-674'], }; const ret = Object.keys(data).map(x => ({ name: x, data: data[x], })); console.log(ret);
You could use a for in
loop and push
each element.
var obj = { "A":["-4927","8779","-9971","-23767"], "B":["-10617","-1456","3131","259"], "C":["-5185","1168","21501","18989"], "D":["2010","5664","2148","-674"] } var newArr = []; for(p in obj){ newArr.push({"name":p,"data":obj[p]}) } console.log(newArr)
Should be:
var newData = [];
$.each($.parseJSON(data), function(k, v) {
newData.push({'name': k, 'data': v});
});
You also don't need to use jQuery. You can do the same in vanilla JS:
var newData = [];
Object.keys(data).forEach(function(k) {
newData.push({'name': k, 'data': data[k]});
});
The following code will return your expected result.
var newData = [];
for(var key in data) {
newData.push({
name: key,
data: data[key]
});
}
If we weren't using jQuery
, we could use a combination of Object.keys() and Array.prototype.map()
Object.keys() method returns an array of a given object's own property names, in the same order as we get with a normal loop.
Object.keys(data)
would simply return ["A", "B", "C", "D"]
The map() method creates a new array with the results of calling a provided function on every element in the calling array.
In that map function callback we can return an object in the specific way we need our data formatted.
const data = { "A": ["-4927", "8779", "-9971", "-23767"], "B": ["-10617", "-1456", "3131", "259"], "C": ["-5185", "1168", "21501", "18989"], "D": ["2010", "5664", "2148", "-674"] } const newData = Object.keys(data).map(function(prop) { return { name: prop, data: data[prop] } }) console.log(newData)
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.