js读取并解析JSON类型数据的方法


Posted in Javascript onNovember 14, 2015

本文实例讲述了js读取并解析JSON类型数据的方法。分享给大家供大家参考,具体如下:

一、什么是JSON?

JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式,同时,JSON是 JavaScript 原生格式。
非常适合于服务器与 JavaScript 的交互

二、为什么使用JSON而不是XML

他们都是这样说的:尽管有许多宣传关于 XML 如何拥有跨平台,跨语言的优势,然而,除非应用于 Web Services,否则,在普通的 Web 应用中,开发者经常为 XML 的解析伤透了脑筋,无论是服务器端生成或处理 XML,还是客户端用 JavaScript 解析 XML,都常常导致复杂的代码,极低的开发效率。实际上,对于大多数 Web 应用来说,他们根本不需要复杂的 XML 来传输数据,XML 的扩展性很少具有优势,许多 AJAX 应用甚至直接返回 HTML 片段来构建动态 Web 页面。和返回 XML 并解析它相比,返回 HTML 片段大大降低了系统的复杂性,但同时缺少了一定的灵活性

三、如何使用

下面代码是html代码片段,实现点击按钮解析json格式数据并alert内容

<input type="button" value="button" onclick="clicks();"/>

下面是js函数代码:
var json = {
  contry:{
  area:{
   man:"12万",
   women:"10万"
  }
  }
 };
//方式一:使用eval解析
 var obj = eval(json);
 alert(obj.constructor);
 alert(obj.contry.area.women);
 //方式二:使用Funtion函数
 var strJSON = "{name:'json name'}";//得到的JSON
 var obj = new Function("return" + strJSON)();//转换后的JSON对象
 alert(obj.name);//json name
 alert(obj.constructor);
//复杂一点的json数组数据的解析
 var value1 = [ 
  {"c01":"1","c02":"2","c03":"3","c04":"4","c05":"5","c06":"6","c07":"7","c08":"8","c09":"9"},
   {"c01":"2","c02":"4","c03":"5","c04":"2","c05":"8","c06":"11","c07":"21","c08":"1","c09":"12"},
  {"c01":"5","c02":"1","c03":"4","c04":"11","c05":"9","c06":"8","c07":"1","c08":"8","c09":"2"}
   ]; 
 var obj1 = eval(value1);
 alert(obj1[0].c01);
 //复杂一点的json的另一种形式
 var value2 = {
   "list":[
   {"password":"1230","username":"coolcooldool"},
   {"password":"thisis2","username":"okokok"}
   ],
   "array":[
   {"password":"1230","username":"coolcooldool"},
   {"password":"thisis2","username":"okokok"}
   ]
   };
 var obj2 = eval(value2);
 alert(obj2.list[0].password);
}

四、eval

① 这种形式将使得性能显著降低,因为它必须运行编译器

② eval函数还减弱了你的应用的安全性,因为它给被求值的文本赋予了太多的权力。就像with语句执行的方式一样,它降低了语言的性能

③ Function构造器是eval的另一种形式,所以它同样也应该被避免使用。

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

Javascript 相关文章推荐
js null,undefined,字符串小结
Aug 21 Javascript
用js来刷新当前页面保留参数的具体实现
Dec 23 Javascript
js正则表达exec与match的区别说明
Jan 29 Javascript
js函数定时器实现定时读取系统实时连接数
Apr 30 Javascript
jQuery简单几行代码实现tab切换
Mar 10 Javascript
原生js的数组除重复简单实例
May 24 Javascript
JS实现浏览器打印、打印预览示例
Feb 28 Javascript
vue项目实现表单登录页保存账号和密码到cookie功能
Aug 31 Javascript
灵活使用console让js调试更简单的方法步骤
Apr 23 Javascript
微信小程序 scroll-view 水平滚动实现过程解析
Oct 12 Javascript
如何解决jQuery 和其他JS库的冲突
Jun 22 jQuery
9个JavaScript日常开发小技巧
Oct 06 Javascript
基于JS实现PHP的sprintf函数实例
Nov 14 #Javascript
javascript动态生成树形菜单的方法
Nov 14 #Javascript
node.js回调函数之阻塞调用与非阻塞调用
Nov 13 #Javascript
JavaScript在网页中画圆的函数arc使用方法
Nov 13 #Javascript
学习JavaScript正则表达式
Nov 13 #Javascript
jquery实现九宫格大转盘抽奖
Nov 13 #Javascript
jquery动画效果学习笔记(8种效果)
Nov 13 #Javascript
You might like
基于Jquery的$.cookie()实现跨越页面tabs导航实现代码
2011/03/03 Javascript
jquery 卷帘效果实现代码(不同方向)
2013/02/05 Javascript
Javascript中arguments用法实例分析
2015/06/13 Javascript
javascript常用函数(1)
2015/11/04 Javascript
Angularjs注入拦截器实现Loading效果
2015/12/28 Javascript
jQuery实现的自定义滚动条实例详解
2016/09/20 Javascript
JS实现的几个常用算法
2016/11/12 Javascript
Vue数据驱动模拟实现4
2017/01/12 Javascript
jQuery实现鼠标经过显示动画边框特效
2017/03/24 jQuery
JS排序之选择排序详解
2017/04/08 Javascript
JavaScript瀑布流布局实现代码
2017/05/06 Javascript
微信小程序中button组件的边框设置的实例详解
2017/09/27 Javascript
Bootstrap栅格系统的使用详解
2017/10/30 Javascript
jQuery使用动画队列自定义动画操作示例
2018/06/16 jQuery
详解angular2如何手动点击特定元素上的点击事件
2018/10/16 Javascript
了解javascript中变量及函数的提升
2019/05/27 Javascript
JS/jQuery实现超简单的Table表格添加,删除行功能示例
2019/07/31 jQuery
[01:36]极致酷炫!TI9典藏宝瓶+撼地者至宝展示
2019/06/11 DOTA
记录Django开发心得
2014/07/16 Python
在Python中操作字典之fromkeys()方法的使用
2015/05/21 Python
Python定时执行之Timer用法示例
2015/05/27 Python
python书籍信息爬虫实例
2018/03/19 Python
利用ctypes获取numpy数组的指针方法
2019/02/12 Python
基于python监控程序是否关闭
2020/01/14 Python
PyCharm License Activation激活码失效问题的解决方法(图文详解)
2020/03/12 Python
浅谈python 类方法/静态方法
2020/09/18 Python
谈谈对css属性box-sizing的了解
2017/01/04 HTML / CSS
阿迪达斯芬兰官方网站:adidas芬兰
2017/01/30 全球购物
美国著名的品牌折扣店:Burlington
2017/06/08 全球购物
匡威德国官网:Converse德国
2019/01/26 全球购物
服务承诺口号
2014/05/22 职场文书
电子信息专业应届生自荐信
2014/06/04 职场文书
2014年设计师工作总结
2014/11/25 职场文书
廉洁自律承诺书2015
2015/01/22 职场文书
2016元旦晚会主持词
2015/07/01 职场文书
victoriaMetrics库布隆过滤器初始化及使用详解
2022/04/05 Golang