JavaScript嵌套對象數組，如何遍歷數組的“ KEY”？

Question

var myCollection = {
"cars": [
          { "name":"Ford", "models":[ "Fiesta", "Focus", "Mustang" ] },
          { "name":"BMW", "models":[ "320", "X3", "X5" ] },
          { "name":"Fiat", "models":[ "500", "Panda" ] }
        ]
}
for ( x in myCollection ) {
  document.getElementById("id1").innerHTML += x + "<br />";
}

Ans：汽車
'name' or 'models' 同樣，我如何顯示數組內部的“ KEY”值， “名稱”或“模型”

for ( x in myCollection.cars ) {
  document.getElementById("id1").innerHTML += x + "<br />"; 
}

答：
0
1
2
為什么返回數組索引值，如何顯示“鍵”值“名稱”或“模型” ？

預期答案：

name      models 

name  OR  models 

name      models 

Answer 1

for循環遍歷每個索引，因此您必須獲取該索引並深入數組

var myCollection = {
"cars": [
          { "name":"Ford", "models":[ "Fiesta", "Focus", "Mustang" ] },
          { "name":"BMW", "models":[ "320", "X3", "X5" ] },
          { "name":"Fiat", "models":[ "500", "Panda" ] }
        ]
}
for ( x in myCollection.cars ) {
  var keys = Object.keys(myCollection.cars[x])
  document.getElementById("id1").innerHTML += keys[0] + "<br />";
}

myCollection.cars [x]是如何獲取數組中的特定對象的方法，並從Object.keys（）提供該對象的鍵。 如果您想要值和鍵

for ( x in myCollection.cars ) {
  var keys = Object.keys(myCollection.cars[x])
  document.getElementById("id1").innerHTML += 
     keys[0] + " : " + myCollection.cars[x].name + " <br />" +
     keys[1] + " : " + myCollection.cars[x].models + "<hr />";
}

Answer 2

for in的意思不是對象的。 您正在使用數組，因此其返回索引。 而是使用如下所示的forEach。

 var myCollection = { "cars": [ { "name":"Ford", "models":[ "Fiesta", "Focus", "Mustang" ] }, { "name":"BMW", "models":[ "320", "X3", "X5" ] }, { "name":"Fiat", "models":[ "500", "Panda" ] } ] } myCollection.cars.forEach(function (value) { //console.log("name" + value.name + ", models" + value.models); //for printing cars alonecars console.log(value.name); //for print models alone value.models.forEach(function (model) { console.log(model); }); }); 

注釋下面的行將得到您想要的輸出，您可以打印汽車或模型。

Answer 3

在這里您可以找到解決方案https://jsfiddle.net/sg6kj0n7/1/

 var myCollection = { "cars": [ { "name":"Ford", "models":[ "Fiesta", "Focus", "Mustang" ] }, { "name":"BMW", "models":[ "320", "X3", "X5" ] }, { "name":"Fiat", "models":[ "500", "Panda" ] } ] } for ( var x in myCollection.cars ) { for (var key in myCollection.cars[x]) { document.getElementById("id1").innerHTML += key + " "; } document.getElementById("id1").innerHTML += "<br/>"; } 

 <div id ="id1"> </div>