javascript中eval解析JSON字符串


Posted in Javascript onFebruary 27, 2016

我们都知道,高级浏览器可以用  JSON.parse() API 将一个 JSON 字符串解析成 JSON 数据,稍微欠妥点的做法,我们可以用 eval() 函数。

var str = '{"name": "hanzichi", "age": 10}';
var obj = eval('(' + str + ')');
console.log(obj); // Object {name: "hanzichi", age: 10}

是否注意到,向 eval() 传参时,str 变量外裹了一层小括号?为什么要这样做?

我们先来看看 eval 函数的定义以及使用。

eval() 的参数是一个字符串。如果字符串表示了一个表达式,eval() 会对表达式求值。如果参数表示了一个或多个 JavaScript 声明, 那么 eval() 会执行声明。不要调用 eval() 来为算数表达式求值; JavaScript 会自动为算数表达式求值。

简单地说,eval 函数的参数是一个字符串,如果把字符串 “noString” 化处理,那么得到的将是正常的可以运行的 JavaScript 语句。

怎么说?举个栗子,如下代码:

var str = "alert('hello world')";
eval(str);

执行后弹出 “hello world”。我们把 str 变量 “noString” 化,粗暴点的做法就是去掉外面的引号,内部调整(转义等),然后就变成了:

alert('hello world')

very good!这是正常的可以运行的 JavaScript 语句!运行之!

再回到开始的问题,为什么 JSON 字符串要裹上小括号。如果不加,是这个样子的:

var str = '{"name": "hanzichi", "age": 10}';
var obj = eval(str); // Uncaught SyntaxError: Unexpected token :

恩,报错了。为什么会报错?试试把 str “noString” 化,执行一下:

{"name": "hanzichi", "age": 10}; 
// Uncaught SyntaxError: Unexpected token :

毫无疑问,一个 JSON 对象或者说是一个对象根本就不是能执行的 JavaScript 语句!等等,试试以下代码:

var str = '{name: "hanzichi"}';
var obj = eval(str);
console.log(obj); // hanzichi

这又是什么鬼?但是给 name 加上 “” 又报错?

var str = '{"name": "hanzichi"}';
var obj = eval(str); // Uncaught SyntaxError: Unexpected token :
console.log(obj);

好吧,快晕了,其实还是可以将 str “nostring” 化,看看是不是能正确执行的 JavaScript 语句。前者的结果是:

{name: "hanzichi"}

这确实是一条合法的 JavaScript 语句。{} 我们不仅能在 if、for 语句等场景使用,甚至可以在任何时候,因为 ES6 之前 JavaScript 只有块级作用域,所以对于作用域什么的并不会有什么冲突。去掉 {} 后 name: "hanzichi"也是合法的语句,一个 label 语句,label 语句在跳出嵌套的循环中非常好用,具体可以参考 label,而作为 label 语句的标记,name 是不能带引号的,标记能放在 JavaScript 代码的任何位置,用不到也没关系。

一旦一个对象有了两个 key,比如 {name: "hanzichi", age: 10} ,ok,两个 label 语句?将 “hanzhichi” 以及 10 分别看做是语句,但是 语句之间只能用封号连接!(表达式之间才能用逗号)。所以改成下面这样也是没有问题的:

var str = '{name: "hanzichi"; age: 10}';
var obj = eval(str); 
console.log(obj); // 10

越扯越远,文章开头代码的错误的原因是找到了,为什么套个括号就能解决呢?简单来说,() 会把语句转换成表达式,称为语句表达式。括号里的代码都会被转换为表达式求值并且返回,对象字面量必须作为表达式而存在。

本文并不会大谈表达式,值得记住的一点是,表达式永远有一个返回值。大部分表达式会包裹在() 内,小括号内不能为空,如果有多个表达式,用逗号隔开,也就是所谓的逗号表达式,会返回最后一个的值。

Javascript 相关文章推荐
JavaScript中通过闭包解决只能取得包含函数中任何变量最后一个值的问题
Aug 12 Javascript
javascript函数中参数传递问题示例探讨
Jul 31 Javascript
浅谈jquery回调函数callback的使用
Jan 30 Javascript
jquery html动态添加的元素绑定事件详解
May 24 Javascript
webpack构建的详细流程探底
Jan 08 Javascript
Vue配合iView实现省市二级联动的示例代码
Jul 27 Javascript
Node.js log4js日志管理详解
Jul 31 Javascript
微信小程序页面缩放式侧滑效果的实现代码
Nov 15 Javascript
react脚手架如何配置less和ant按需加载的方法步骤
Nov 28 Javascript
实现Vue的markdown文档可以在线运行的方法示例
Dec 11 Javascript
JS学习笔记之闭包小案例分析
May 29 Javascript
JS中的算法与数据结构之常见排序(Sort)算法详解
Aug 16 Javascript
javascript先序遍历DOM树的方法
Feb 27 #Javascript
JavaScript开发者必备的10个Sublime Text插件
Feb 27 #Javascript
Javascript生成全局唯一标识符(GUID,UUID)的方法
Feb 27 #Javascript
JS原型、原型链深入理解
Feb 27 #Javascript
Javascript中Date类型和Math类型详解
Feb 27 #Javascript
原生javascript实现匀速运动动画效果
Feb 26 #Javascript
探索angularjs+requirejs全面实现按需加载的套路
Feb 26 #Javascript
You might like
QQ登录 PHP OAuth示例代码
2011/07/20 PHP
基于php导出到Excel或CSV的详解(附utf8、gbk 编码转换)
2013/06/25 PHP
php 字符串中的\n换行符无效、不能换行的解决方法
2014/04/02 PHP
php获取中文拼音首字母类和函数分享
2014/04/24 PHP
javascript some()函数用法详解
2014/11/13 PHP
php使用Cookie实现和用户会话的方法
2015/01/21 PHP
用JavaScript实现单继承和多继承的简单方法
2009/03/29 Javascript
解决IE6的PNG透明JS插件使用介绍
2013/04/17 Javascript
获取下拉列表框的值是数组,split,$.inArray示例
2013/11/13 Javascript
javascript同步服务器时间和同步倒计时小技巧
2015/09/24 Javascript
sso跨域写cookie的一段js脚本(推荐)
2016/05/25 Javascript
浅谈javascript中关于日期和时间的基础知识
2016/07/13 Javascript
jQuery插件EasyUI设置datagrid的checkbox为禁用状态的方法
2016/08/05 Javascript
微信开发 消息推送实现代码
2016/10/21 Javascript
Nodejs中使用phantom将html转为pdf或图片格式的方法
2017/09/18 NodeJs
JS实现的找零张数最小问题示例
2017/11/28 Javascript
微信小程序时间标签和时间范围的联动效果
2019/02/15 Javascript
vue模仿网易云音乐的单页面应用
2019/04/24 Javascript
Vue实现滑动拼图验证码功能
2019/09/15 Javascript
js HTML DOM EventListener功能与用法实例分析
2020/04/27 Javascript
[32:47]完美世界DOTA2联赛 GXR vs IO 第二场 11.07
2020/11/09 DOTA
Pycharm学习教程(7)虚拟机VM的配置教程
2017/05/04 Python
Python使用getpass库读取密码的示例
2017/10/10 Python
Python 类方法和实例方法(@classmethod),静态方法(@staticmethod)原理与用法分析
2019/09/20 Python
在Windows上安装和配置 Jupyter Lab 作为桌面级应用程序教程
2020/04/22 Python
Python爬取微信小程序Charles实现过程图解
2020/09/29 Python
python+openCV对视频进行截取的实现
2020/11/27 Python
pyqt5实现井字棋的示例代码
2020/12/07 Python
细说NumPy数组的四种乘法的使用
2020/12/18 Python
英国蛋糕装饰用品一站式商店:Craft Company
2019/03/18 全球购物
德国购买门票网站:ADticket.de
2019/10/31 全球购物
意大利买卖二手奢侈品网站:LAMPOO
2020/06/03 全球购物
个人反四风对照检查材料思想汇报
2014/09/23 职场文书
2014年检察院个人工作总结
2014/12/09 职场文书
调任通知
2015/04/21 职场文书
社区服务理念口号
2015/12/25 职场文书