javascript for-in有序遍历json数据并探讨各个浏览器差异_javascript技巧

object本身就是无对象的集合,因此在用 for-in 语句遍历对象的属性时,遍历出的属性顺序与对象定义时不同。

了解W3C标准:

根据 ECMA-262(ECMAScript)第三版中描述,for-in 语句的属性遍历的顺序是由对象定义时属性的书写顺序决定的。

关于 ECMA-262(ECMAScript)第三版中 for-in 语句的更多信息,请参考 ECMA-262 3rd Edition 中 12.6.4 The for-in Statement。

在现有最新的 ECMA-262(ECMAScript)第五版规范中,对 for-in 语句的遍历机制又做了调整,属性遍历的顺序是没有被规定的。

关于 ECMA-262(ECMAScript)第五版中 for-in 语句的更多信息,请参考 ECMA-262 5rd Edition 中 12.6.4 The for-in Statement。

新版本中的属性遍历顺序说明与早期版本不同,这将导致遵循 ECMA-262 第三版规范内容实现的 JavaScript 解析引擎在处理 for-in 语句时,与遵循第五版规范实现的解析引擎,对属性的遍历顺序存在不一致的问题。

 因此在开发中应尽量避免编写依赖对象属性顺序的代码。如下:

<script>
var json1 = {
    "2":{"name":"第1条"},
    "1":{"name":"第2条"},
    "3":{"name":"第3条"}
}
var json2 = [
    {"name":"第1条"},
    {"name":"第2条"},
    {"name":"第3条"}
]
for(var i in json1){
    alert(json1[i].name);
}
//正确
for(var i in json2){
    alert(json2[i].name);
}
</script>

看看for-in代码在个浏览器差异:

下面通过一段代码单独给大家介绍JS 循环遍历JSON数据

JSON数据如:

{"options":"[{/"text/":/"王家湾/",/"value/":/"9/"},{/"text/":/"李家湾/",/"valu
e/":/"10/"},{/"text/":/"邵家湾/",/"value/":/"13/"}]"}

用js可以写成:

var data=[{name:"a",age:12},{name:"b",age:11},{name:"c",age:13},{name:"d",age:14}];
   for(var o in data){
    alert(o);
    alert(data[o]);
    alert("text:"+data[o].name+" value:"+data[o].age );
   } 

或是

<script type="text/javascript">
function text(){
 var json = {"options":"[{/"text/":/"王家湾/",/"value/":/"9/"},{/"text/":/"李家湾/",/"value/":/"10/"},{/"text/":/"邵家湾/",/"value/":/"13/"}]"}
 json = eval(json.options)
 for(var i=0; i<json.length; i++)
 {
   alert(json[i].text+" " + json[i].value)
 }
}
</script> 

以上是小编为您精心准备的的内容,在的博客、问答、公众号、人物、课程等栏目也有的相关内容,欢迎继续使用右上角搜索按钮进行搜索javascript_json遍历
js_json遍历
javascript 遍历数组、javascript 遍历对象、javascript map 遍历、javascript 遍历json、javascript 遍历,以便于您获取更多的相关知识。

时间: 2024-09-19 09:58:54

javascript for-in有序遍历json数据并探讨各个浏览器差异_javascript技巧的相关文章

javascript常用方法、属性集合及NodeList 和 HTMLCollection 的浏览器差异_javascript技巧

在您开始本文的阅读前,我强烈建议您可以先读一读此篇:http://w3help.org/zh-cn/causes/SD9004.            HTMLCollection 接口定义   interface HTMLCollection{      readonly attribute unsigned long   length;      Node               item(in unsigned long index);      Node              

JS中如何判断传过来的JSON数据中是否存在某字段_javascript技巧

如何判断传过来的JSON数据中,某个字段是否存在, 1.obj["key"] != undefined 这种有缺陷,如果这个key定义了,并且就是很2的赋值为undefined,那么这句就会出问题了. 2.!("key" in obj) 3.obj.hasOwnProperty("key") 这两种方法就比较好了,推荐使用. 答案原文: Actually, checking for undefined-ness is not an accurat

javascript:json数据的页面绑定示例代码_javascript技巧

web开发中,如果需要将"服务端返回的json对象"绑定到"现有页面上的dom元素",传统赋值的方式太繁琐,写起来也很累(特别是json对象很大时),于是想出了下面的偷懒方法,不过有二个前提: 1.元素的id要与json对象中的属性命名一致2.json对象中的属性名,最好不要重复 复制代码 代码如下: <!doctype html><html><head><title>json对象遍历演示</title>&

基于JavaScript实现Json数据根据某个字段进行排序_javascript技巧

一.首先给大家介绍js中内置的 sort() 方法 此方法默认是按字母顺序对数组中的元素进行排序的,说得更精确点,是按照字符编码的顺序进行排序. 看如下例子: 当数组中元素为 数字类型 时,排序结果与我们设想的完全不同,因为默认是按照字符编码的顺序进行排序的. 解决方案:sort() 方法接收一个可选参数(此参数必须是函数),我们可以自己定义排序规则,如下图 二.  对 json 排序的具体实现 /* * @description 根据某个字段实现对json数组的排序 * @param arra

javascript对JSON数据排序的3个例子_javascript技巧

一.适用于数字排序和字幕排序json 的排序方法有很多种,这是其中最简单的一种方法. 复制代码 代码如下: var sortBy = function (filed, rev, primer) {     rev = (rev) ? -1 : 1;     return function (a, b) {         a = a[filed];         b = b[filed];         if (typeof (primer) != 'undefined') {       

json数据与字符串的相互转化示例_javascript技巧

json转成string[需要引用json2.js文件]: 复制代码 代码如下: var arr=[{id:'id',name:'Spring'},{id:'id2',name:'Jane'}]; var str=JSON.stringify(arr); 结果:"[{id:'id',name:'Spring'},{id:'id2',name:'Jane'}]" string转化为json: 复制代码 代码如下: var str="[{id:'id',name:'Spring'

js 遍历json返回的map内容示例代码_javascript技巧

复制代码 代码如下: var yData = [];//Y轴数据 var xData = [];//X轴数据 $(data.rows).each(function(i){ var obj = data.rows[i]; // alert(obj.key); // alert(obj.value); yData.push(obj.key); //动态取值 xData.push(obj.value); //动态取值 });

Jquery遍历Json数据的方法

  这篇文章主要介绍了Jquery遍历Json数据的方法,涉及jQuery遍历json格式数据的相关技巧,非常具有实用价值,需要的朋友可以参考下 本文实例讲述了Jquery遍历Json数据的方法.分享给大家供大家参考.具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 4

Jquery遍历Json数据的方法_jquery

本文实例讲述了Jquery遍历Json数据的方法.分享给大家供大家参考.具体如下: <html> <head> <title>jQuery遍历json</title> <script src="js/jquery-1.5.2.min.js" type="text/javascript"></script> </head> <script> var a = { "