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 相关文章推荐
Javascript实现的分页函数
Dec 22 Javascript
Jquery实现点击切换图片并隐藏显示内容(2种方法实现)
Apr 11 Javascript
js sort 二维数组排序的用法小结
Jan 24 Javascript
jQuery中end()方法用法实例
Jan 08 Javascript
javascript伸缩菜单栏实现代码分享
Nov 12 Javascript
jQuery操作属性和样式详解
Apr 13 Javascript
如何让一个json文件显示在表格里【实现代码】
May 09 Javascript
JavaScript中transform实现数字翻页效果
Mar 08 Javascript
Vue响应式原理详解
Apr 18 Javascript
微信小程序网络封装(简单高效)
Aug 06 Javascript
详解如何在Vue里建立长按指令
Aug 20 Javascript
js实现无缝轮播图效果
Mar 09 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仿QQ验证码的实例分析
2013/07/01 PHP
php中Y2K38的漏洞解决方法实例分析
2014/09/22 PHP
php5.3不能连接mssql数据库的解决方法
2014/12/27 PHP
php使用socket post数据到其它web服务器的方法
2015/06/02 PHP
php实现生成PDF文件的方法示例【基于FPDF类库】
2018/07/21 PHP
laravel-admin自动生成模块,及相关基础配置方法
2019/10/08 PHP
javascript vvorld 在线加密破解方法
2008/11/13 Javascript
javascript 冒号 使用说明
2009/06/06 Javascript
WordPress JQuery处理沙发头像
2009/06/22 Javascript
jQuery实现列表自动滚动循环滚动展示新闻
2014/08/22 Javascript
JS清除选择内容的方法
2015/01/29 Javascript
详解JavaScript的Date对象(制作简易钟表)
2020/04/07 Javascript
js判断手机访问或者PC的几个例子(常用于手机跳转)
2015/12/15 Javascript
js实现ctrl+v粘贴上传图片(兼容chrome、firefox、ie11)
2016/03/09 Javascript
node.js 用socket实现聊天的示例代码
2017/10/17 Javascript
微信小程序时间轴实现方法示例
2019/01/14 Javascript
javascript面向对象创建对象的方式小结
2019/07/29 Javascript
jquery添加div实现消息聊天框
2020/02/08 jQuery
python获取图片颜色信息的方法
2015/03/18 Python
详细解读Python的web.py框架下的application.py模块
2015/05/02 Python
python递归打印某个目录的内容(实例讲解)
2017/08/30 Python
Python做智能家居温湿度报警系统
2018/09/25 Python
Pycharm无法使用已经安装Selenium的解决方法
2018/10/13 Python
python切片(获取一个子列表(数组))详解
2019/08/09 Python
python应用文件读取与登录注册功能
2019/09/23 Python
浅谈python的elementtree模块处理中文注意事项
2020/03/06 Python
python爬虫容易学吗
2020/06/02 Python
纯CSS3实现的阴影效果
2014/12/24 HTML / CSS
推荐WEB开发者最佳HTML5和CSS3代码生成器
2015/11/24 HTML / CSS
Otiumberg官网:英国半精致珠宝品牌
2021/01/16 全球购物
怎么可以提高数据库查询数据的速度
2014/06/28 面试题
工商管理专业实习大学生自我鉴定
2013/09/19 职场文书
辞职离别感言
2015/08/04 职场文书
2016婚礼主持词开场白
2015/11/24 职场文书
《将心比心》教学反思
2016/02/23 职场文书
解决vue-router的beforeRouteUpdate不能触发
2022/04/14 Vue.js