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 相关文章推荐
File文件控件,选中文件(图片,flash,视频)即立即预览显示
Apr 09 Javascript
JavaScript 异步调用框架 (Part 6 - 实例 &amp; 模式)
Aug 04 Javascript
基于jquery的jqDnR拖拽溢出的修改
Feb 12 Javascript
浅析document.createDocumentFragment()与js效率
Jul 08 Javascript
javascript操作数组详解
Dec 17 Javascript
JavaScript插件化开发教程(六)
Feb 01 Javascript
js select实现省市区联动选择
Apr 17 Javascript
解析Json字符串的三种方法日常常用
May 02 Javascript
详解如何在nuxt中添加proxyTable代理
Aug 10 Javascript
微信小程序开发摇一摇功能
Nov 22 Javascript
js实现简单进度条效果
Mar 25 Javascript
Bootstrap table 服务器端分页功能实现方法示例
Jun 01 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
缓存技术详谈―php
2006/12/14 PHP
php二分法在IP地址查询中的应用
2008/08/12 PHP
php写的带缓存数据功能的mysqli类
2012/09/06 PHP
php笔记之:数据类型与常量的使用分析
2013/05/14 PHP
php 获取今日、昨日、上周、本月的起始时间戳和结束时间戳的方法
2013/09/28 PHP
PHP判断来访是搜索引擎蜘蛛还是普通用户的代码小结
2015/09/14 PHP
jQuery1.6 类型判断实现代码
2011/09/01 Javascript
js 实现在离开页面时提醒未保存的信息(减少用户重复操作)
2013/01/16 Javascript
javascript匿名函数实例分析
2014/11/18 Javascript
使用JQuery在线制作ppt并在线演示源码特效
2015/09/08 Javascript
深入学习JavaScript对象
2015/10/13 Javascript
json格式的javascript对象用法分析
2016/07/04 Javascript
浅谈jquery高级方法描述与应用
2016/10/04 Javascript
利用Angular.js编写公共提示模块的方法教程
2017/05/28 Javascript
javascript将json格式数组下载为excel表格的方法
2017/12/22 Javascript
Vue父子组件双向绑定传值的实现方法
2018/07/31 Javascript
用POSTMAN发送JSON格式的POST请求示例
2018/09/04 Javascript
nodejs提示:cross-device link not permitted, rename错误的解决方法
2019/06/10 NodeJs
JQuery复选框全选效果如何实现
2020/05/08 jQuery
JS性能优化实现方法及优点进行
2020/08/30 Javascript
vue实现验证用户名是否可用
2021/01/20 Vue.js
Python使用Pycrypto库进行RSA加密的方法详解
2016/06/06 Python
Python rstrip()方法实例详解
2018/11/11 Python
python-视频分帧&amp;多帧合成视频实例
2019/12/10 Python
Pytoch之torchvision.transforms图像变换实例
2019/12/30 Python
Tensorflow获取张量Tensor的具体维数实例
2020/01/19 Python
python GUI库图形界面开发之PyQt5多线程中信号与槽的详细使用方法与实例
2020/03/08 Python
香蕉共和国Banana Republic官网:美国GAP旗下偏贵族风格服饰品牌
2016/11/21 全球购物
New Balance澳大利亚官网:运动鞋和健身服装
2019/02/23 全球购物
英国玛莎百货澳大利亚:Marks & Spencer Australia
2019/08/30 全球购物
写一个方法,输入一个文件名和一个字符串,统计这个字符串在这个文件中出现的次数
2016/04/13 面试题
低碳环保口号
2014/06/12 职场文书
物业保洁员岗位职责
2015/02/13 职场文书
计算机实训心得体会
2016/01/14 职场文书
《倍数和因数》教学反思
2016/02/23 职场文书
原来实习报告是这样写的呀!
2019/07/03 职场文书