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

Posted 2023-02-22

【中文标题】如何在 jQuery 中遍历这个 JSON 对象？

【英文标题】：How do I iterate through this JSON object in jQuery?

【发布时间】：2012-04-10 20:02:34

【问题描述】：

我有一个由 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]); 
;

【问题讨论】：

我为后代清理了你的代码，这是一个很好的例子。

【参考方案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);
 

【讨论】：

嘿，谢谢，我决定坚持使用 for in 语法。只是我比较熟悉的来自 PHP 和 Java 背景的东西

警报中不应该是“i”而不是“key”吗？..使用“i”对我有用

感谢您的关注，@Ravin！这是一个错字 - 复制粘贴的力量 :)

【参考方案2】：

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

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

【参考方案3】：

你使用$.each()。 它看起来像这样：

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

【讨论】：

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

OP 正在尝试遍历日期数组，数组有一个长度：developer.mozilla.org/en-US/docs/Web/javascript/Reference/…

【参考方案4】：

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

例如

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