Loop through JSON with javascript

Question

Here are many examples how to iterate over javascript Objects. This works actually fine for me

    var text = '{"employees":[' +
'{"firstName":"John","lastName":"Doe" },' +
'{"firstName":"Anna","lastName":"Smith" },' +
'{"firstName":"Peter","lastName":"Jones" }]}';

obj = JSON.parse(text);
document.getElementById("demo").innerHTML =
obj.employees[1].firstName + " " + obj.employees[1].lastName;

But didn't work out how to iterate over the values in obj. Tried like this

    for(var k in obj) {
    if (obj.hasOwnProperty(k)) {
        if (obj.hasOwnProperty(k)) {
             out +=("Key is " + k + ", value is" + obj[k].firstName);
        }
    }
}

but failed. As you can see stolen from examples. If someone can help with some javascript code to iterate over the JSON key-value pairs ?

Why are you writing `text` out a string then parsing it instead of just declaring as an object in the first place, which would be much easier programatically and semantically? — Popnoodles, Aug 18 '15 at 13:56
@Popnoodles: I would assume to emulate receiving it from an ajax call or similar (but it's an assumption). — T.J. Crowder, Aug 18 '15 at 13:59
Cerbrus this was just a trie to iterare over both key and values. Popnoodles...because I don't know js good enough....anyhow do you have an example how to iterate such a json array ? — user3732793, Aug 18 '15 at 14:06

score 2 · Accepted Answer · edited May 23 '17 at 12:06

2

Once parsed, your obj variable refers to an object with an employees property which refers to an array. So:

obj.employees.forEach(function(employee) {
    // ...
});

or

var i, employee;
for (i = 0; i < obj.employees.length; ++i) {
    employee = obj.employees[i];
    // ...
}

...or any of the several other ways outlined in this answer.

edited May 23 '17 at 12:06

Community

1
1

answered Aug 18 '15 at 14:01

T.J. Crowder

1,031,962
187
1,923
1,875

1

excellent thanks, I like the first one it's small and straight forward – user3732793 Aug 18 '15 at 15:08

score 1 · Answer 2 · answered Aug 18 '15 at 14:01

Your example json has parent key employees, which has child array of objects. Then you have to loop through array if you know the key else you can use Object.keys which will return list of keys in object in array format.

var text = '{"employees":[' +
  '{"firstName":"John","lastName":"Doe" },' +
  '{"firstName":"Anna","lastName":"Smith" },' +
  '{"firstName":"Peter","lastName":"Jones" }]}';

obj = JSON.parse(text);

Object.keys(obj).forEach(function(k) { //Loop through keys of obj.
  obj[k].forEach(function(elm) {  //Loop through all elements of first object array
    console.log(elm.firstName+"_"+elm.lastName)
  })
})

score 0 · Answer 3 · answered Aug 18 '15 at 14:03

It's not working as you are trying to access obj["employees"].firstName which does not exist.

for(var k in obj) {
  if (obj.hasOwnProperty(k)){
    var employee = obj[k];
    for(var i in employee){
      out +="Key is " + i + ", value is" + employee[i].firstName;
    }
  }
}

OR

var employee = obj["employees"];
for(var i in employee){
  out +="Key is " + i + ", value is" + employee[i].firstName;
}

Loop through JSON with javascript

3 Answers3