How can I convert something like initialArray array of JSON objects into finalObject map?

var initialArray = [
             { id:'id1', name:'name1' },
             { id:'id2', name:'name2' },
             { id:'id3', name:'name3' },
             { id:'id4', name:'name4' }
          ];

var finalObject = {
                  'id1':'name1',
                  'id2':'name2',
                  'id3':'name3',
                  'id4':'name4'
               }

Things to consider:

• IDs are strings.
• I tried for in loop - couldn't make it to work - /

Any ideas?

How can I convert something like initialArray array of JSON objects into finalObject map?

var initialArray = [
             { id:'id1', name:'name1' },
             { id:'id2', name:'name2' },
             { id:'id3', name:'name3' },
             { id:'id4', name:'name4' }
          ];

var finalObject = {
                  'id1':'name1',
                  'id2':'name2',
                  'id3':'name3',
                  'id4':'name4'
               }

Things to consider:

• IDs are strings.
• I tried for in loop - couldn't make it to work - http://jsfiddle/5af9R/23/

Any ideas?

• javascript
• jquery
• json

• 2 Those are just JavaScript objects, there is no JSON in your input. – Quentin Commented Mar 2, 2012 at 21:04

8 Answers 8

You need to operate on the objects in your array, not strings containing their indexes in the array.

You should also use a regular for loop to iterate over an array.

Your JSFiddle, fixed:

var x = [ {id:'1', img:'img1'}, {id:'2', img:'img2'}, {id:'3', img:'img3'} ];
var resp = {};

for( var i = 0 ; i < x.length ; i++ ){
    var obj = x[i];
    resp[obj.id] = obj.img;
}

document.write( JSON.stringify(resp, undefined, 2) );
​

DEMO

You can loop over the array, and for each object, add a new property to finalObject whose property name is the id, and whose value is the name.

var finalObject = {};

for (var i = 0, max = initialArray.length; i < max; i++)
    finalObject[initialArray[i].id] = initialArray[i].name;

resp[key.id] = key.img;

You correctly call it key. But you need a value;

resp[x[key].id] = x[key].img;

var finalObject = initialArray.reduce(function(ret, obj){
  ret[obj.id] = obj.name;
  return ret;
}, {});

This solution is specific to the property names for the specific question, but Array.prototype.reduce is a function I use all the time for any sort of array iteration that requires a non-array result.

You're not using For In correctly jsFiddle

var x = [ {id:'1', img:'img1'}, {id:'2', img:'img2'}, {id:'3', img:'img3'} ];
var resp = {};

for( var key in x ){
    resp['id' + x[key].id] = x[key].img;
}

document.write( JSON.stringify(resp, undefined, 2) );

​

for (var i=0; i<x.length; i++) {
    var id = 'id' + x[i].id;
    var img = x[i].img;
    resp[id] = img;
}

if i have understood correctly you can do something like

var x =' [ {"id":"1", "img":"img1"}, {"id":"2", "img":"img2"}, {"id":"3", "img":"img3"}]';
var resp = {};
var json = $.parseJSON(x);
$(json).each(function(i,v){        
    resp[v.id]=v.img;
});

 console.log( resp);

DEMO

you talked about json but in the fiddle you provided there was no json even jquery was not added as a resource so i made some assumptions

Today I was on the same question and I didn't find an answer here, except the answer of @adam-rackis.

The way I found is :

var initialArray = [
    { id:'id1', name:'name1' },
    { id:'id2', name:'name2' },
    { id:'id3', name:'name3' },
    { id:'id4', name:'name4' }
],
    finalObject = {};

$.each(initialArray, function(k,v) {
    finalObject[v.name] = v.value;
});