Converting JSON array to objects

Question

I have the following JSON array:

[
    {"id": "01", "state": "Alabama", "category": "Coal", "detail1": null, "detail2": null},
    {"id": "02", "state": "Alaska", "category": null, "detail1": null, "detail2": null},
    {"id": "04", "state": "Arizona", "category": "Oil", "detail1": null, "detail2": null}
]

That I need to turn into this:

{
    "01": { "state":"Alabama", "category":"A", "detail1":"Status 1", "detail2":"Lorem ipsum dolor sit amet, consectetur adipiscing elit. "},
    "02": { "state":"Alaska", "category":"B", "detail1":"Status2", "detail2":"Integer egestas fermentum neque vitae mattis. "},
    "04": { "state":"Arizona", "category":"C", "detail1":"Status 3", "detail2":"Fusce hendrerit ac enim a consequat. "}
}

But I can't figure out how. Can anyone help?

you don't modify json. you build a native data structure and ENCODE/DECODE it to/from json. — Marc B, Aug 31 '15 at 21:51
Loop over the structure you have and build up the new structure adding keys/values as you need. — gen_Eric, Aug 31 '15 at 21:51

blex · Answer 1 · 2015-08-31T22:10:22.463

1

You can loop over the elements, and populate a new Object along the way:

var arr = [
    {"id": "01", "state": "Alabama", "category": "Coal", "detail1": null, "detail2": null},
    {"id": "02", "state": "Alaska", "category": null, "detail1": null, "detail2": null},
    {"id": "04", "state": "Arizona", "category": "Oil", "detail1": null, "detail2": null}
];

// Here, I create a copy of the array to avoid modifying the original one.
var obj = {}, copy = JSON.parse( JSON.stringify(arr) );

for(var i in copy){
  obj[ copy[i].id ] = copy[i]; // Add the element to obj, at index id
  delete copy[i].id; // Remove the id from the inserted object
}

console.log(obj);

edited Aug 31 '15 at 22:10

answered Aug 31 '15 at 21:55

blex

24,941
5
39
72

1

Be careful with this, since it will change the objects in the original array! This might be okay, but it could have unexpected consequences. – StriplingWarrior Aug 31 '15 at 21:56
@StriplingWarrior Thanks! Fixed. – blex Aug 31 '15 at 21:59
If you 're going to clone something, better to clone the items of the array instead. (and `Array.reduce` would work out better here) – Jeff Mercado Aug 31 '15 at 22:00
1

@JeffMercado: How would `Array.reduce` work to solve this problem? That's not immediately obvious to me. – StriplingWarrior Aug 31 '15 at 22:04
`JSON.parse( JSON.stringify(arr)` is a very inefficient and poor way to copy an array as it can fundamentally change members of the array that represent any type other than string or number (e.g. Dates, Functions, Booleans, etc.). – RobG Aug 31 '15 at 22:20
1

@StriplingWarrior— `array.reduce(function(obj, v){return obj.id = ...},{})`. – RobG Aug 31 '15 at 22:23
@RobG Would you suggest using real cloning, like [this](http://stackoverflow.com/a/728694/1913729) ? That would make things much more complicated considering the given use case which only contains primitive values... _Note: Booleans won't be affected._ – blex Aug 31 '15 at 22:24
@blex—the OP needs to add the values in whatever way suits, shortcomings of a particular method should be pointed out in the answer. Boolean objects are converted to Boolean primitives. – RobG Aug 31 '15 at 23:07
@RobG: Your comment seems wrong to me, but it looks like you provided a more correct implementation in a separate answer. Thank you. – StriplingWarrior Sep 01 '15 at 14:36

score 0 · Accepted Answer · answered Aug 31 '15 at 22:35

Looping over an array to create a new value typically uses reduce, which allows values to be accumulated in a value that can be passed along to the next invocation of the callback.

I'll assumed in this case that you just want a shallow copy of each member passed in with the id property removed and added to the new value, which can be an object:

var arr = [
    {"id": "01", "state": "Alabama", "category": "Coal", "detail1": null, "detail2": null},
    {"id": "02", "state": "Alaska", "category": null, "detail1": null, "detail2": null},
    {"id": "04", "state": "Arizona", "category": "Oil", "detail1": null, "detail2": null}
]

// Loop over all numeric members of arr
var newStructure = arr.reduce(function(obj, v){

  // Store the value of the ID property of the passed in object
  var id = v.id;
 
  // Remove the id property from the passed in object
  delete v.id;

  // Add the id value and remainder of the object to the accumulator
  obj[id] = v; 

  // Return the accumulator
  return obj;
},{});

document.write(JSON.stringify(newStructure));

Note that this modifies the original objects, the code to copy them instead isn't much longer.

Converting JSON array to objects

2 Answers2