How to loop through json response in javascript?


#1

i tried to use forEach but it returns forEach is not a function.

     response : [{"name":"Brinth"},{"name":"Chellapan"}]

#2

Like this?

const json = {
  response: [
    {"name":"Brinth"},
    {"name":"Chellapan"}
  ]
}

json.response.forEach(el => {
  console.log(el);
});

#3

Objects are not iterable and don't have the forEach() method. If you really had to you can also use Object.entries(json) which would take all the properties and their values in the object and create array entries as key/value pairs.

Object.entries(json) -> [["response", [{"name":"Brinth"}, {"name":"Chellapan"}]]

If you really want to loop through json, or any object, use a for(...in...) loop. This will grab all of the properties in an object. You can then use that property as a key in the object to grab the values.

for( let prop in obj ){
    console.log( obj[prop] );
}

#4

Yeah but i used JSON.parse(response);


#5

Arrays of objects are absolutely iterable. Arrays dont care whats inside them, they just iterate.

If you ran JSON.parse over it, you presumably caught the result in some variable, right? In which case the question is whether the 'response' bit was actually IN the response, or you're just showing that bit.

1a: If the response was already JSON (and typed as such by the server during transfer), you dont need to parse it. Catch it and use it directly.
1b: If the response was a string (returned as type/text), parse it and catch the result in a variable (on the assumption you want to do more than 1 thing with it). I'll call it 'stuff'.
2a: If the 'response:' bit was part of the actual response, your JSON wasn't legal (because it would need {} wrapped around it). If it was made legal for parsing, your array would be iterable as forEach(stuff.response).
2b: If the 'response' bit was NOT part of the actual response, your JSON was legal, and your array is iterable

Scenario 1a.

response.forEach(function(item) {
  //etc
})

Scenario 1b,2a:

var stuff = JSON.parse('{'+response.replace("response",'"response"')+'}';
stuff.response.forEach(function(item) {
//Stuff
});

Scenario 1b,2b:

var stuff = JSON.parse(response);
stuff.forEach(function(item) {
 //Stuff
});

Example of iteration:

JSON.parse('[{"wark":"targ"},{"wark":"lot"}]').forEach(function(element) { console.log(element.wark); })  
VM466:1 targ
VM466:1 lot

#6

I didn't know they were parsing a response with the property containing a JSON array. @James_Hibbard explained that they were confused about accessing the property of response to iterate.

As far as I know the Object prototype is 'iterable' in the same sense that you can iterate over an array. Though objects which store data in similar ways as arrays tend to do so with numerical properties, so in that sense they very much are iterable. You can incrementally loop over them until the numerical index is undefined, the object prototype also doesn't have a length property.

Conceptually an object is not meant to be a collection of data in the same way an array is so you can't 'iterate' over them. Anyway this was a misunderstanding. Just be careful how you word stuff because your argument is not iterating over an object. Parsing an array from JSON is still an array.


#7

... noone ever said anything about iterating an object. You changed the OP's post into talking about objects. The OP clearly defines the response as an array.


#8

Yeah, but to be fair, arrays don't have keys. Seemed more like he had left something out.


#9

I admitted that. I was mistaken.


closed #10

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.