Accessing data in JS structure

Question

I'm trying to parse the following data:

data = [       
   {"id":"orderBy", "options" : [
       {"value":"order-by=newest&", "name":"newest"},
       {"value":"order-by=relevance&", "name":"relevance"}
   ]},
   {"id":"searchBy", "options" : [
       {"value":"search-by=name&", "name":"name"},
       {"value":"search-by=number&", "name":"number"},
       {"value":"search-by=date&", "name":"date"},
       {"value":"search-by=location&", "name":"location"}
   ]}
];

Using this data I want to iterate through each object and return its ID, and then all of it options.

I know I need to use for loop like this:

for (var i =0; i < data.length; i++) {

  var id = data[i].id;
  var optionText = data[i].options[i].text;
  var optionValue = data[i].options[i].value;

  console.log(id);
  console.log(optionText);
  console.log(optionValue); 
}:

This loop only returns the first OptionText & OptionValue from the data. Can you teach me what I'm doing wrong?

Thanks.

you are on the right track, you just need to do another foreach for the options, right now you are using the same i from the original loop. — David Nguyen
– David Nguyen, Commented Nov 14, 2016 at 18:09
Couple of things: you don't have JSON. JSON is a string format that needs to be parsed before you use it. What you have is an array of objects. You also are not parsing it. Parsing is (usually) taking something from a string format and putting it into a format that is used by your program. As for how to get the right data, you seem to understand how to use for loops to go through the first level. Could you use another for loop to get the inner items? — Mike Cluck
– Mike Cluck, Commented Nov 14, 2016 at 18:10

Nina Scholz · Accepted Answer · 2016-11-14 18:11:42Z

4

You could use another for loop for the inner array.

var data = [{ "id": "orderBy", "options": [{ "value": "order-by=newest&", "name": "newest" }, { "value": "order-by=relevance&", "name": "relevance" }] }, { "id": "searchBy", "options": [{ "value": "search-by=name&", "name": "name" }, { "value": "search-by=number&", "name": "number" }, { "value": "search-by=date&", "name": "date" }, { "value": "search-by=location&", "name": "location" }] }],
    i, j, id, optionText, optionValue;

for (i = 0; i < data.length; i++) {
    id = data[i].id;
    for (j = 0; j < data[i].options.length; j++) {
        optionText = data[i].options[j].name;
        optionValue = data[i].options[j].value;
        console.log(id, optionText, optionValue); 
    }
}

answered Nov 14, 2016 at 18:11

Nina Scholz

388k26 gold badges367 silver badges417 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Elliott James · Accepted Answer · 2016-11-15 20:55:51Z

1

data = [       
   {"id":"orderBy", "options" : [
       {"value":"order-by=newest&", "name":"newest"},
       {"value":"order-by=relevance&", "name":"relevance"}
   ]},
   {"id":"searchBy", "options" : [
       {"value":"search-by=name&", "name":"name"},
       {"value":"search-by=number&", "name":"number"},
       {"value":"search-by=date&", "name":"date"},
       {"value":"search-by=location&", "name":"location"}
   ]}
];
    
for (var i in data) {
  var id = data[i].id;
  console.log(id)
  for (var opt of data[i].options){
    console.log(opt.value);
    console.log(opt.name)
  }

}

You lacked an interation loop. Also I believe it could be the perfect example for you to see the difference (and existence?) of iterating through objects and arrays with in and of

edited Nov 15, 2016 at 20:55

Elliott James

1651 silver badge15 bronze badges

answered Nov 14, 2016 at 18:16

ted

14.9k10 gold badges70 silver badges117 bronze badges

Comments

TimoStaudinger · Accepted Answer · 2016-11-14 18:12:33Z

You have two levels of arrays you need to loop through. First loop through the outer array, and then through the options of each item:

var data = [{"id":"orderBy","options":[{"value":"order-by=newest&","name":"newest"},{"value":"order-by=relevance&","name":"relevance"}]},{"id":"searchBy","options":[{"value":"search-by=name&","name":"name"},{"value":"search-by=number&","name":"number"},{"value":"search-by=date&","name":"date"},{"value":"search-by=location&","name":"location"}]}];

for (var i = 0; i < data.length; i++) {
  var id = data[i].id;
  console.log(id);
  
  for(var j = 0; j < data[i].options.length; j++) {
    var optionText = data[i].options[j].name;
    var optionValue = data[i].options[j].value;
    console.log(optionText);
    console.log(optionValue);
  }
}

Collectives™ on Stack Overflow

Accessing data in JS structure

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related