mrtonyb
mrtonyb

Reputation: 615

JavaScript looping through multimensional JSON arrays

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."
                   }
                  ]
               }
            ]

Upvotes: 1

Views: 88

Answers (3)

jimm101
jimm101

Reputation: 998

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. 

Upvotes: 1

rink.attendant.6
rink.attendant.6

Reputation: 46228

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.

Upvotes: 1

Thomas
Thomas

Reputation: 212

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)) {
            ...
        }
    }
    

Upvotes: 0

Related Questions