JSON遍历方式实例总结


Posted in Javascript onDecember 07, 2015

本文实例总结了JSON遍历方式。分享给大家供大家参考,具体如下:

第一种:使用for循环

js代码:

function CyclingJson1() { 
 var testJson = '[{ "name": "小强", "age": 16 },{"name":"小明","age":17}]'; 
 testJson = eval("(" + testJson + ")"); 
 for (var i = 0; i < testJson.length; i++) { 
  alert(testJson[i].name); 
 } 
}

第二种:使用关键字in

js代码:

function CyclingJson2() {
 var testJson = '[{ "name": "小强", "age": 16 },{"name":"小明","age":17}]'; 
 testJson = eval("(" + testJson + ")");
 for (var i in testJson) {
  alert(testJson[i].name);
 }
}

第三种;使用jquery.each()函数

function CyclingJson3() {
 var testJson = '[{ "name": "小强", "age": 16 },{"name":"小明","age":17}]';
 testJson = eval("(" + testJson + ")");
 $.each(testJson, function (i, n) {
  alert(i); //i为索引值
  alert(n.name); //n为遍历的值
 });
}

综合实例:

<script language="javascript" type="text/javascript">
var array = { "a": "abc", "b": [1, 2, 3, 4, 5, 6], "c": 3, "d": { "name": "james", "age": 28},"e":null,"f":true };
var arrayObj = { "a": { "name": "kobe", "age": 34 }, "b": { "name": "lofo", "age": 28} };
//遍历array方式1
for (var x in array) {
 if (typeof array[x] == 'object' && array[x] != null ) {
  for (var y in array[x]) {
   alert("key = " + y + " value = " + array[x][y]);
  }
 } else {
  alert("key = " + x + " value = " + array[x]); // 非array object
 }
}
//遍历array方式2
$.each(array, function(k, v) {
 var a = typeof (v);
 //数组与对象为object类型,其他分别是string与number类型
 //此时的k代表a、b、c、d,v代表对应的值
 if (typeof (v) == "object") {
  //获取数组与对象后,再去遍历这个数组与对象
  $.each(v, function(k1, v1) {
   window.alert("key = " + k1 + " value=" + v1);
  });
 } else {
  window.alert("key = " + k + " value=" + v);
 }
});
//遍历arrayObj方式1
for (var x in arrayObj) {
 for (var key in arrayObj[x]) {
  window.alert("key=" + key + " value=" + arrayObj[x][key]);
 }
}
//遍历arrayObj方式2
$.each(arrayObj, function(key, value) {
 $.each(value, function(k, v) {
  window.alert("key=" + k + " value=" + v);
 });
});
//遍历arrayObj方式3
$.each(arrayObj, function(key, value) {
 window.alert("key=" + key + " valueName=" + value.name + " valueAge=" + value.age);
});
</script>
<script language="javascript" type="text/javascript">
var UserList = [
 { "UserID": 11, "Name": { "FirstName": "Truly", "LastName": "Zhu" }, "Email": "" },
 { "UserID": 12, "Name": { "FirstName": "Jeffrey", "LastName": "Richter" }, "Email": "" },
 { "UserID": 13, "Name": { "FirstName": "Scott", "LastName": "Gu" }, "Email": "" }
]
$.each(UserList, function(k, v) {
 $.each(v, function(k1, v1) {
  if (typeof (v1) == "object") {
   $.each(v1, function(k2, v2) {
    window.alert("key=" + k2 + " value=" + v2);
   });
  } else {
   window.alert("key=" + k1 + " value=" + v1);
  }
 });
});
</script>
<script language="javascript" type="text/javascript">
var userArray = [
 { "UserID": 11, "Name": { "FirstName": "Truly", "LastName": "Zhu" }, "Email": "" },
 { "UserID": 12, "Name": { "FirstName": "Jeffrey", "LastName": "Richter" }, "Email": "" },
 { "UserID": 13, "Name": { "FirstName": "Scott", "LastName": "Gu" }, "Email": "" }
];
for (var i in userArray) {
 for (var k in userArray[i]) {
  if (typeof userArray[i][k] == "object" && userArray[i][k] != null) {
   for (var j in userArray[i][k]) {
    window.alert("key=" + j + "--value=" + userArray[i][k][j]);
   }
  } else {
   window.alert("key=" + k + "--value=" + userArray[i][k]);
  }
 }
}
</script>

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
List the Stored Procedures in a SQL Server database
Jun 20 Javascript
jQuery内置的AJAX功能和JSON的使用实例
Jul 27 Javascript
javascript实现倒计时(精确到秒)
Jun 26 Javascript
js编写一个简单的产品放大效果代码
Jun 27 Javascript
jQuery属性选择器用法示例
Sep 09 Javascript
通过jquery实现页面的动画效果(实例代码)
Sep 18 Javascript
Vue动态组件实例解析
Aug 20 Javascript
JS跳转手机站url的若干注意事项
Oct 18 Javascript
dropload.js插件下拉刷新和上拉加载使用详解
Oct 20 Javascript
VueJS 组件参数名命名与组件属性转化问题
Dec 03 Javascript
vue 实现购物车总价计算
Nov 06 Javascript
JS数组索引检测中的数据类型问题详解
Jan 11 Javascript
JS实现日期时间动态显示的方法
Dec 07 #Javascript
基于jQuey实现鼠标滑过变色(整行变色)
Dec 07 #Javascript
js实现遍历含有input的table实例
Dec 07 #Javascript
JavaScript中的return语句简单介绍
Dec 07 #Javascript
深入理解Java线程编程中的阻塞队列容器
Dec 07 #Javascript
JS与jQuery遍历Table所有单元格内容的方法
Dec 07 #Javascript
JavaScript的History API使搜索引擎抓取AJAX内容
Dec 07 #Javascript
You might like
全国FM电台频率大全 - 22 重庆市
2020/03/11 无线电
解析如何通过PHP函数获取当前运行的环境 来进行判断执行逻辑(小技巧)
2013/06/25 PHP
php解析url的三个示例
2014/01/20 PHP
详解Window7 下开发php扩展
2015/12/31 PHP
xml分页+ajax请求数据源+dom取结果实例代码
2008/10/31 Javascript
Javascript判断对象是否相等实现代码
2013/03/18 Javascript
IE浏览器IFrame对象内存不释放问题解决方法
2014/08/22 Javascript
JavaScript程序中实现继承特性的方式总结
2016/06/24 Javascript
文本框只能输入数字的实现方法(兼容IE火狐)
2016/06/25 Javascript
AngularJS 表达式详解及实例代码
2016/09/14 Javascript
vue拦截器Vue.http.interceptors.push使用详解
2017/04/22 Javascript
vue-router单页面路由
2017/06/17 Javascript
js实现随机点名小功能
2017/08/17 Javascript
angular实现页面打印局部功能的思考与方法
2018/04/13 Javascript
vue cli3.0 引入eslint 结合vscode使用
2019/05/27 Javascript
vue实现移动端图片上传功能
2019/12/23 Javascript
js实现盒子移动动画效果
2020/08/09 Javascript
[47:55]Ti4第二日主赛事败者组 NaVi vs EG 1
2014/07/20 DOTA
[52:08]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第一局
2016/03/05 DOTA
python基于右递归解决八皇后问题的方法
2015/05/25 Python
python-opencv颜色提取分割方法
2018/12/08 Python
Python读取xlsx文件的实现方法
2019/07/04 Python
Python 3 判断2个字典相同
2019/08/06 Python
matplotlib 生成的图像中无法显示中文字符的解决方法
2020/06/10 Python
说一下Linux下有关用户和组管理的命令
2016/01/04 面试题
生物科学专业职业规划书范文
2014/02/11 职场文书
最新优秀教师个人先进事迹材料
2014/05/06 职场文书
会计专业应届生自荐信
2014/06/28 职场文书
我们的节日春节活动方案
2014/08/22 职场文书
教师党员个人自我剖析材料
2014/09/29 职场文书
2014年药品销售工作总结
2014/12/16 职场文书
工作犯错保证书
2015/05/11 职场文书
2015年学校教科室工作总结
2015/07/20 职场文书
PHP对接阿里云虚拟号的实现(号码隐私保护)
2021/04/06 PHP
漫画「日和酱的要求是绝对的」第3卷封面公开
2022/03/21 日漫
PostgreSQL并行计算算法及参数强制并行度设置方法
2022/04/07 PostgreSQL