Ajax中解析Json的两种方法对比分析


Posted in Javascript onJune 25, 2015

eval();  //此方法不推荐

JSON.parse();  //推荐方法

一、两种方法的区别

我们先初始化一个json格式的对象:

var jsonDate = '{ "name":"周星驰","age":23 }'


var jsonObj = eval( '(' + jsonDate + ')' ); // eval();方法


var jsonObj = JSON.parse( jsonDate ); // JSON.parse(); 方法

然后在控制台调用:

console.log( jsonObj.name );  // 两种方法都可以正确输入 周星驰

那么问题来了 两种方法有什么区别呢?(下面我们稍微把代码改动一下,蓝色字体为修改部分)

var jsonDate = '{ "name":alert("hello"),"age":23 }'


var jsonObj = eval( '(' + jsonDate + ')' ); // eval();方法


console.log( jsonObj.age ); //会先执行“alert”输出“hello” 然后才输出 23

换“JSON.parse();”方法:

var jsonDate = '{ "name":alert("hello"),"age":23 }'


var jsonObj = JSON.parse( jsonDate ); // JSON.parse(); 方法


cosole.log( jsonobj.age ) // 报错 这个错误告诉我们这个字符串是不合法的

小结:“eval();”方法解析的时候不会去判断字符串是否合法,而且json对象中的js方法也会被执行,这是非常危险的;而“JSON.parse();”方法的优点就不用多说了,推荐此方法。(不明白的盆友可以自己在控制台测试一下)

二、扩展问题

var jsonDate = '{ "name":"周星驰","age":23 }'

大家可以看到在上面测试时一直用红色把包在花括号外面的引号标注了起来,这对引号是很关键却又是常常被忽略的,因为 “eval();” 和 “JSON.parser();” 这两个方法的参数只接受字符串,也就是说只能解析字符串!!

那我不经会有一个思考,我们在初始化的时候若不加引号对,那么它本身就是对象,js可以直接获取对象本身的属性和方法;为什么还要加引号将它变成字符串之后再用 “eval();” 或者 “JSON.parse();” 解析,这样做不是既不环保又没有效率吗?

原因很简单:前端提供给后台的只能是字符串数据格式,后台返回给前台的就看返回的是什么数据格式,是字符串就必须解析之后再用。

(这个小问题一般大家都会忽略掉,不太关注。我之所以好奇的原因也是因为对后台了解的不够,把这个问题抛出来希望对后台不熟的朋友有所帮助,知道是怎么回事后自然而然会加深记忆,在开发过程中就不会漏掉了)

以上所述就是本文的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
js实现图片放大缩小功能后进行复杂排序的方法
Nov 08 Javascript
原生JavaScript编写俄罗斯方块
Mar 30 Javascript
js基础知识(公有方法、私有方法、特权方法)
Nov 06 Javascript
jQuery编写网页版2048小游戏
Jan 06 Javascript
微信小程序 input输入框详解及简单实例
Jan 10 Javascript
详解vue的数据binding绑定原理
Apr 12 Javascript
web.js.字符串与正则表达式操作
May 13 Javascript
React+react-dropzone+node.js实现图片上传的示例代码
Aug 23 Javascript
vue.js整合mint-ui里的轮播图实例代码
Dec 27 Javascript
vue.js select下拉框绑定和取值方法
Mar 03 Javascript
Vue组件Draggable实现拖拽功能
Dec 01 Javascript
原生js实现贪吃蛇游戏
Oct 26 Javascript
新手快速学习JavaScript免费教程资源汇总
Jun 25 #Javascript
JavaScript中字符串(string)转json的2种方法
Jun 25 #Javascript
深入理解JavaScript编程中的原型概念
Jun 25 #Javascript
Backbone.js 0.9.2 源码注释中文翻译版
Jun 25 #Javascript
在JavaScript应用中实现延迟加载的方法
Jun 25 #Javascript
Underscore.js 1.3.3 中文注释翻译说明
Jun 25 #Javascript
深入分析JSON编码格式提交表单数据
Jun 25 #Javascript
You might like
PHP中空字符串介绍0、null、empty和false之间的关系
2012/09/25 PHP
php获取通过http协议post提交过来xml数据及解析xml
2012/12/16 PHP
php结合web uploader插件实现分片上传文件
2016/05/10 PHP
PHP中$GLOBALS['HTTP_RAW_POST_DATA']和$_POST的区别分析
2017/07/03 PHP
php封装db类连接sqlite3数据库的方法实例
2017/12/19 PHP
使用javascript为网页增加夜间模式
2014/01/26 Javascript
jQuery动态添加及删除表单上传元素的方法(附demo源码下载)
2016/01/15 Javascript
基于javascript实现全屏漂浮广告
2016/03/31 Javascript
Vue数据驱动模拟实现5
2017/01/13 Javascript
原生js仿浏览器滚动条效果
2017/03/02 Javascript
js图片加载效果实例代码(延迟加载+瀑布流加载)
2017/05/12 Javascript
原生JavaScript实现的简单省市县三级联动功能示例
2017/05/27 Javascript
动态创建Angular组件实现popup弹窗功能
2017/09/15 Javascript
原生JavaScrpit中异步请求Ajax实现方法
2017/11/03 Javascript
解决vue-router中的query动态传参问题
2018/03/20 Javascript
angular2实现统一的http请求头方法
2018/08/13 Javascript
使用mpvue搭建一个初始小程序及项目配置方法
2018/12/03 Javascript
layui操作列按钮个数和文字颜色的判断实例
2019/09/11 Javascript
bootstrap实现嵌套模态框的实例代码
2020/01/10 Javascript
序列化模块json代码实例详解
2020/03/03 Javascript
Vue发布订阅模式实现过程图解
2020/04/30 Javascript
Node.js API详解之 os模块用法实例分析
2020/05/06 Javascript
[07:52]2014DOTA2 TI逗比武士游V社解说背后的故事
2014/07/10 DOTA
[01:03:36]DOTA2-DPC中国联赛 正赛 VG vs Magma BO3 第二场 1月26日
2021/03/11 DOTA
[16:01]夜魇凡尔赛茶话会 第二期01:你比划我猜
2021/03/11 DOTA
收集的几个Python小技巧分享
2014/11/22 Python
python统计文本文件内单词数量的方法
2015/05/30 Python
python的exec、eval使用分析
2017/12/11 Python
python3 webp转gif格式的实现示例
2019/12/10 Python
台湾租车首选品牌:IWS艾维士租车
2019/05/03 全球购物
最新党员思想汇报
2014/01/01 职场文书
教育实践活动对照检查材料
2014/09/23 职场文书
继续教育个人总结
2015/03/03 职场文书
三十年再续同学情倡议书
2019/11/27 职场文书
SQL之各种join小结详细讲解
2021/08/04 MySQL
macos系统如何实现微信双开? mac登录两个微信以上微信的技巧
2022/07/23 数码科技