循环遍历 JSON 数组会给出“未定义”的结果 [重复]答案

【问题标题】：Looping through a JSON Array gives "undefined" results [duplicate]循环遍历 JSON 数组会给出“未定义”的结果 [重复]
【发布时间】：2016-01-31 11:36:26
【问题描述】：

我从 AJAX 解析了一个 JSON 字符串（在 response var 中）：

JSON

{
   "TheArray":[  
      {  
         "AlmostThere": {  
            "whatWeAreLookingFor":"Hello"
         }
      },
      {
        "AlmostThere": {
            "whatWeAreLookingFor":"Goodbye"
        }
      }
   ]
}

正在解析的 JSON

var jsonData = JSON.parse(response); //response is the string version of the JSON code!

现在，我需要循环进入 JSON 数组，这里称为TheArray。我这样做：

循环数组

for (var contents in jsonData["TheArray"]) {

}

在里面，我们得到whatWeAreLookingFor元素的值：

for (var contents in jsonData["TheArray"]) {
    console.log(contents.whatWeAreLookingFor + "!");
}

但是有一个问题！控制台输出... undefined!。 - 我尝试了多种方法来完成这项工作，例如使用contents["whatWeAreLookingFor"] 等等，但我仍然得到相同的结果。

【问题讨论】：

Don't use for... in for looping over Arrays - 如果可以使用 ES6，请使用常规的 for 循环、forEach 或 for... of。
提示：在你的循环中记录contents。这不会是你所期望的。
for (var contents in jsonData.TheArray) { console.log(jsonData.TheArray[contents].AlmostThere.whatWeAreLookingFor + "!"); }

标签： javascript jquery arrays json

【解决方案1】：

您忘记访问AlmostThere

  jsonData.TheArray[i].AlmostThere.whatWeAreLookingFor

for (var i = 0; i < jsonData.TheArray.length; i++) {
    console.log(jsonData.TheArray[i].AlmostThere.whatWeAreLookingFor);
}

【讨论】：

【解决方案2】：

如果你以你的方式循环你的数组TheArray，contents var 将变成这两个对象：

{  
     "AlmostThere": {  
        "whatWeAreLookingFor":"Hello"
     }
}

和

{
    "AlmostThere": {
        "whatWeAreLookingFor":"Goodbye"
    }
}

现在您想使用

访问该值

contents.whatWeAreLookingFor

但是这些对象的这个属性是未定义的。所以你的控制台记录undefined。您必须通过以下方式访问该值：

contents.AlmostThere.whatWeAreLookingFor

所以你得到对象AlmostThere并选择属性whatWeAreLookingFor。

如果您使用 jquery，您应该使用：

$.each(jsonData.TheArray, function() {
     console.log(contents.AlmostThere.whatWeAreLookingFor + '!');
});

API：http://api.jquery.com/jquery.each/

【讨论】：

【解决方案3】：

for... in 迭代对象的键。对于数组，这意味着 (approximately) 索引 0、1、2 等。

您可以改用 Array.prototype.forEach：

jsonData.theArray.forEach(function(contents) {
  console.log(contents.AlmostThere.whatWerAreLookingFor);
})

【讨论】：