JavaScript looping through multimensional JSON arrays

Question

I've been unable to locate the correct solution to my problem here. I'd like to loop through the nested Products arrays to display each Product name. Is it possible with what I've written, or do I need to re-write it in a way that allows me to query what I need easier?

            [
               {
                  "category":"A",
                  "products":[
                   {
                     "id":1,
                     "name":"Product 1",
                     "description":"Description of my product 1."
                   },
                   {
                     "id":2,
                     "name":"Product 2",
                     "description":"Description of my product 2."
                   },
                   {
                     "id":3,
                     "name":"Product 3",
                     "description":"Description of my product 3."
                   }
                  ]
               },
               {
                  "category":"B",
                  "products":[
                   {
                     "id":4,
                     "name":"Product 4",
                     "description":"Description of my product 4 in cat B."
                   },
                   {
                     "id":5,
                     "name":"Product 5",
                     "description":"Description of my product 5 in cat B."
                   },
                   {
                     "id":6,
                     "name":"Product 6",
                     "description":"Description of my product 6 in cat B."
                   }
                  ]
               }
            ]

I think what you're looking for has been answered here : stackoverflow.com/questions/17298443/… — Hotted24
– Hotted24, Commented Aug 20, 2014 at 14:32

rink.attendant.6 · Accepted Answer · 2014-08-20 14:31:40Z

1

Assuming that this whole structure is in a variable called data:

data.forEach(function(category) {
    if (category.hasOwnProperty('product')) {
        category.products.forEach(function(product) {
            console.log(product.name);
        });
    }
});

The outer forEach loops through all of the category objects. The inner forEach loops goes through all of the products objects in each category.

answered Aug 20, 2014 at 14:31

rink.attendant.6

46.7k64 gold badges111 silver badges161 bronze badges

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

Comments

jimm101 · Accepted Answer · 2014-08-20 14:52:30Z

In general looping through an array things = [...] is done like this:

for( var i=0; i<thing.length; i++ ) {
    // do stuff with thing[i]
}

Looping through an object things = {...} is done like this:

for( key in things ) {
    if( things.hasOwnProperty(key) ) {
        // do stuff with things[key] or key.
    }
}

You can nest them all you like.

In your case, if we name your original data structure items, then (see http://jsfiddle.net/7yc5arLe/):

for( item=0; item<items.length; item++ ) {
    console.log('category is '+items[item].category);
    for( product=0; product<items[item].products.length; product++ ) {
        p = items[item].products[product];
        for( key in p ) {
            console.log('  product '+key+' is '+items[item].products[product][key]);
        }
    }
}

will output

category is A
  product id is 1
  product name is Product 1
  product description is Description of my product 1.
  product id is 2
  product name is Product 2
  product description is Description of my product 2.
  product id is 3
  product name is Product 3
  product description is Description of my product 3.
category is B
  product id is 4
  product name is Product 4
  product description is Description of my product 4 in cat B.
  product id is 5
  product name is Product 5
  product description is Description of my product 5 in cat B.
  product id is 6
  product name is Product 6
  product description is Description of my product 6 in cat B.

Thomas · Accepted Answer · 2014-08-20 14:31:15Z

0

Of course it is possible.

To loop over an array [] :

for (initialization; condition; update) {
    ...
}

To loop over an object {} :

for (variable in object) {
    if (object.hasOwnProperty(variable)) {
        ...
    }
}

answered Aug 20, 2014 at 14:31

Thomas

2121 silver badge8 bronze badges

Collectives™ on Stack Overflow

JavaScript looping through multimensional JSON arrays

3 Answers 3

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related