JavaScript 循环遍历多维 JSON 数组

Question

我无法在此处找到解决问题的正确方法。我想遍历嵌套的 Products 数组以显示每个 Product 名称。我所写的是否有可能，或者我是否需要以一种允许我更轻松地查询我需要的内容的方式重写它？

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

Answer 1

假设整个结构在一个名为data的变量中：

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

外部forEach 循环遍历所有类别对象。内部 forEach 循环遍历每个类别中的所有产品对象。

Answer 2

一般循环遍历数组things = [...] 是这样完成的：

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

循环通过对象things = {...} 是这样完成的：

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

你可以随意嵌套它们。

在您的情况下，如果我们将您的原始数据结构命名为 items，那么 （见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]);
        }
    }
}

会输出

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. 

Answer 3

当然可以。

• 循环数组[]：

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

• 循环对象{}：

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