在JavaScript中遍历对象中的数组

Question

可能是重复问题：
如何遍历Json对象

{
  "data": [
    {
      "name": "Jen",
      "id": "1"
    },
    {
      "name": "Steve",
      "id": "8"
    }
  ]
}

我正在与一台服务器互动，它回应的内容如上所示。

我正在尝试循环遍历它，在 For..in 语句中输入enter code here。

这是我想要做的：

for (var item in response.data) {
  console.log(item.name);
}

这不起作用。

出了什么问题？

谢谢。

在阅读评论后，我使用以下方法使其工作:

for (var item in response.data) {
  console.log(response.data[item].name);
}

我能够获得一个名称列表...

有人能解释一下为什么它有效吗？

- William Sham

---

你确定那是 JavaScript 而不是 JSON 吗？ - james_womack

他正在数组上循环！ - hugomg

我们在StackOverflow上询问如何循环遍历数组/对象的次数有多少次了？我敢打赌这已经是第100次了；确实可以看到：https://www.google.com/search?as_q=loop+javascript+object&as_epq=&as_oq=&as_eq=&as_nlo=&as_nhi=&lr=&cr=&as_qdr=all&as_sitesearch=stackoverflow.com&as_occt=any&safe=images&tbs=&as_filetype=&as_rights=。还有那个“你确定那是Javascript而不是JSON”的评论？你知道JSON代表什么吗？ - Dexygen

@GeorgeJempty - 关于JSON，你是什么意思？JSON并不是JavaScript的一部分，它只是看起来像... 在使用JavaScript对象和JSON时，区分它们是至关重要的... - nnnnnn

请查看我对这个问题的回答，其中有很好的解释：http://stackoverflow.com/questions/9415851/how-to-change-the-background-image-of-a-button-using-javascript/9415967#9415967 - ckozl

Answer 1

data实际上是一个数组（用[]表示），而不是对象，因此您需要使用普通的for循环而不是for in。

for (var i = 0; i<response.data.length; i++) {
  // use i as an array index
  console.log(response.data[i].name);
}

在JavaScript中，for in结构用于迭代对象的属性，但通常使用增量for循环来迭代数组。

- Michael Berkowski

---

我已经成功地使用了上述格式。我只是好奇如何使用For..in来实现它。但是谢谢你！那证实了我的想法。 - William Sham

Answer 2

请看：为什么在数组迭代中使用“for ... in”是一个不好的习惯？ 对于...而言，它遍历对象属性的名称。数组元素也被视为“属性”，因此for..in遍历索引（在您的例子中为0、1）。当您使用response.data [0]时，您将获得数组的第一个元素，这是预期的结果。

- Alexei Levenkov

Answer 3

for..in 循环按照无特定顺序迭代对象的可枚举属性（在不同的浏览器中可能会得到不同的顺序）。数组只是一个普通对象，具有特殊的 length 方法和从 Array.prototype 继承的方便方法（其中一些依赖于特殊的 length 属性）。对于属性名称可以使用任何内容，它们不限于非负整数（请注意，如果属性名称不是有效的标识符，则必须使用方括号表示法来访问其值）。

数组的索引只是字符串属性名称（即它们只是普通对象属性名称），它们是非负整数，因此 for..in 循环将迭代数字索引（同样不一定按升序或降序排列）以及所有其他可枚举属性，包括 [[Prototype]] 链上的属性。因此，除非您想包含继承的可枚举属性，否则始终建议在 for..in 中包含一个 hasOwnProperty 测试。

由于上述原因，通常最好使用从 0 到 array.length - 1 的计数器迭代数组属性（因为长度始终比最后一个索引大一）。

为了测试“无特定顺序”的说法，请在IE和其他浏览器中尝试以下操作，并注意不同的顺序：

var a = [];
a[2] = 2;
a[0] = 0;
a[3] = 3;
var b = [];
for (var i in a) b.push(a[i]);
alert(b);

- RobG