下载APP 编程狮,随时随地学编程
返回 首页

JSON 教程

JSON数据遍历之for-in

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 语句时,与遵循第五版规范实现的解析引擎,对属性的遍历顺序存在不一致的问题。
 因此在开发中应尽量避免编写依赖对象属性顺序的代码。如下:

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);
}

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

json遍历

下面通过一段代码单独给大家介绍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数组遍历for与for in区别详解

js中遍历数组的有两种方式

代码如下:
var array = ['a']
//标准的for循环
for (var i = 1; i < array.length; i++) {
    alert(array[i])
}
//foreach循环
for (var i in array) {
    alert(array[i])
}

正常情况下上面两种遍历数组的方式结果一样。首先说两者的第一个区别

标准的for循环中的i是number类型,表示的是数组的下标,但是foreach循环中的i表示的是数组的key是string类型,因为js中一切皆为对象。自己试试 alert(typeof i);这个区别是小问题。现在我加上如下代码,上面的执行结果就不一样了。


代码如下:
//扩展了js原生的Array
Array.prototype.test=function(){
 
}
试试看上面的代码执行什么。我们发现标准的for循环任然真正的对数组循环, 但是此时foreach循环对我刚才写的test方法写打印出来了。这就是for与foreach遍历数组的最大区别,如果我们在项目采用的是用foreach遍历数组,假设有一天谁不小心自己为了扩展js原生的Array类,或者引入一个外部的js框架也扩展了原生Array。那问题就来了。


再此建议两点

1.不要用for in遍历数组,全部统一采用标准的for循环变量数组(我们无法保证我们引入的js是否会采用prototype扩展原生的Array)
2.如果要对js的原生类扩展的时候,不要采用prototype了

目录
关于 JSON

JSON 教程

JSON 教程导读
JSON 简介
JSON 语法
JSON 使用
JSONP 教程
JSON在线解析及格式化验证工具

JSON 基础

JSON 数据类型
JSON 对象
JSON 模式
JSON 与 XML 对比

json格式

JSON 基础结构
JSON 数据格式

JSON 示例

在PHP 中使用JSON
在 Perl 中使用 JSON
在 Python 中使用 JSON
在 Ruby 中使用 JSON
在 Java 中使用 JSON
JSON 与 Ajax

JSON解析

JSON 数据解析的方法
JSON 数据解析过程详解
一个JavaScript函数把URL参数解析成Json对象
JSON 元素的添加删除
JSON 数据解析的3种方式
JavaScript 解析Json字符串的性能比较分析代码
JavaScript解析json格式数据简单示例

JSON遍历

JSON数据遍历之for-in
Jquery 遍历Json的实现代码
JS遍历Json字符串
直接在JS里创建JSON数据然后遍历使用
JS循环遍历JSON数据的方法
js 遍历json返回的map内容示例代码

JSON调用

JSP+jquery使用ajax方式调用json的实现方法
jquery中的ajax方法怎样通过JSONP进行远程调用
jquery ajax jsonp跨域调用实例代码
jQuery插件jQuery-JSONP开发ajax调用使用注意事项
json的键名为数字时的调用方式
php跨域调用json的例子
jquery中ajax调用json数据的使用说明
ASP.NET(AJAX+JSON)实现对象调用

JSON转换

JavaScript转换与解析JSON方法实例详解
将JavaScript的jQuery库中表单转化为JSON对象的方法
javascript中JSON对象与JSON字符串相互转换实例
JavaScript中字符串(string)转json的方法
JavaScript将XML转成JSON的方法
java与javascript之间json格式数据互转介绍
转义字符(\\\\\\\\)对JavaScript中JSON.parse的影响概述
JavaScript中json对象和string对象之间相互转化
javascript中将Object转换为String函数代码 (json str)
转换json格式的日期为Javascript对象的函数

JSON获取

AJAX跨域请求获取JSON数据
JS根据key值获取URL中的参数值
jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
js获取json元素数量的方法
JSONP获取Twitter和Facebook文章数的具体步骤
js获取通过ajax返回的map型的JSONArray的方法
JSP中获取ExtJS.Ajax前台传递的JSON数据实现过程
jQuery中使用Ajax获取JSON格式数据示例代码
JQuery 获取json数据$.getJSON方法的实例代码

JSON字符串

javascript中JSON对象与JSON字符串相互转换实例
JavaScript中字符串(string)转json的方法
IE6/IE7中JavaScript json提示缺少标识符、字符串或数字问题处理
使用JavaScript构建JSON格式字符串实现步骤
JavaScript 解析Json字符串的性能比较分析代码

JSON数组

javascript巧用eval函数组装表单输入项为json对象的方法
用javascript对一个json数组深度赋值示例
解析javascript 数组(以及json元素的添加删除)
js数组如何添加json数据
js/jquery解析json和数组格式的方法详解

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }