如何在jQuery中迭代遍历这个JSON对象？

Question

我有一个由 PHP 生成的 JSON 对象。它是一个包含一组日期的对象。它有时间戳和格式化后的日期版本。我该如何在 jQuery 中遍历它？

{
  "dates":[
    {
      "timeStamp": 1317596400,
      "formattedDate": "Mon 03 October 2011"
    },
    {
      "timeStamp": 1317682800,
      "formattedDate": "Tue 04 October 2011"
    },
    {
      "timeStamp": 1317855600,
      "formattedDate": "Thu 06 October 2011"
    }
  ]
}

我尝试过：

for (var i in data) { 
  alert(data.dates[i].timeStamp); 
};

for (var i in data) { 
  alert(data[i].dates.timeStamp); 
};

和

for (var i in data) { 
  alert(data.dates.timeStamp[i]); 
};

- Johnathan Au

---

我为了后人整理了你的代码，这是一个很好的例子。 - Mike Kormendy

Answer 1

由于您将问题标记为jquery，所以应使用$.each，因为它是jquery的迭代函数：

$.each(data.dates, function(index, element) {
    alert(element.timeStamp); 
});

如果您想坚持使用for in语法（我看到您已经尝试过），可以尝试以下解决方案：

for(var key in data.dates) {
     alert(data.dates[key].timeStamp); 
} 

但要注意，for in 语法可能比您想象的更加强大：它遍历从原型继承的属性，因此确保仅在对象实例属性上迭代可能是有用的：

for(var key in data.dates) {
    // if it's not something from the prototype
    if(data.dates.hasOwnProperty(key)) {
        alert(data.dates[key].timeStamp); 
    }
} 

更新
另一种简洁的方法是使用Object.keys方法，该方法返回一个包含目标对象中所有键的数组，以迭代该对象的所有属性：

for(var i=0, keys=Object.keys(data.dates), l=keys.length; i<l; i++) {
    alert(data.dates[i].timeStamp);
} 

- gion_13

---

嘿，谢谢。我决定坚持使用for in语法。这是我从PHP和Java背景中更熟悉的东西。 - Johnathan Au

在警告框中，应该使用“i”而不是“key”，这样才对。我使用“i”可以正常工作。 - KuroNeko

谢谢注意，@Ravin！这是一个笔误 - 复制粘贴的力量 :) - gion_13

Answer 2

您使用的是 $.each() 方法。
它的使用方式如下：

$.each(data, function(n, elem) {
    // here you process your data to data loaded to lines               
});

- mfadel

---

$.each在没有长度的情况下不起作用，只会被忽略。 - gcoleman0828

OP 正在尝试迭代一个日期数组，数组具有长度：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/length - Mike Simmons

Answer 3

您可以使用jQuery each来简单地遍历json结构：

$.each(data, function(index, element) {
   alert(element.dates.timeStamp); 
});

- Mohammed Irfan Tirupattur

Answer 4

jQuery.each() 可能是最简单的方法，看看这个链接：http://api.jquery.com/jQuery.each/

例如

$.each(dates, function(index, date) { alert(date.timeStamp); });

- Mike Simmons