浅入浅出JS中的eval及json
声明:
首先声明一下,本人是JS新手,所以不敢说深入,只是把最近对eval的学习经验拿出来跟大家分享,如果您是高手可略去不看。
适合读者:
对JS中的eval一知半解,不知eval是如何把字符串转换为json对象的,在用eval把字符串转换为json时常遇到“missing ] after element list”错误却不知哪儿错了的朋友
一、Eval介绍(这部分来自http://www.w3school.com.cn/js/jsref_eval.asp)
定义和用法:eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码。
语法:eval(string)
参数string:必需。要计算的字符串,其中含有要计算的 JavaScript 表达式或要执行的语句。
返回值:通过计算 string 得到的值(如果有的话)。
说明:该方法只接受原始字符串作为参数,如果 string 参数不是原始字符串,那么该方法将不作任何改变地返回。因此请不要为 eval() 函数传递 String 对象来作为参数。如果试图覆盖 eval 属性或把 eval() 方法赋予另一个属性,并通过该属性调用它,则 ECMAScript 实现允许抛出一个 EvalError 异常。
异常:如果参数中没有合法的表达式和语句,则抛出 SyntaxError 异常。如果非法调用 eval(),则抛出 EvalError 异常。如果传递给 eval() 的 Javascript 代码生成了一个异常,eval() 将把该异常传递给调用者。
二、Eval用法示例
对于编程方面的问题我一直认为说明问题最好的方法就是示例,看了上面的定义我们再来看几个例子:
code 1:
1 var code1="\"a\" + 2";
2 var code2= {"a":2};
3 var code3 ="{\"b\":3}";
4
5 console.log(code1);
6 console.log(eval(code1));
7
8 console.log(code2);
9 console.log(code2.a);
10 console.log(eval(code2));
11 console.log(eval('('+ code2 +')'));
12
13 console.log(code3);
14 console.log(code3.b);
15 t = eval('('+code3+')');
16 console.log(t);
17 console.log(t.b);
从5到17行分别会输出什么呢?在这里简单解析一下:
code1是一个字符串加数字的表达式字符串,所以第5行原样输出为"a"+2,第6行经eval运算后输出a2。
code2是一个json对象(关于json定义参考:深入浅出JSON),所以第8行输出Object { a=2},如果用alert(code2)会弹出[object Object]。第9行输出2。第10行呢,由于code2是一个json对象,不是一个字符串,因此eval在这里没有起作用,原样返回,所以跟第8行输出一样。第11行呢,由于code2已经是一个json对象,把json对象两边加一个括号进行运算的结果是什么呢,JS中这个语法是错的,所以这行会报异常,如果我们捕获一下异常输出会是什么呢,就是新手非常头痛的“missing ] after element list”了。
code3是一个json格式的字符串,因此第13行输出{"b":3}。第14行输出undefined。第15行对这个字符串加括号(加括号的原因请看下文)后进行eval运算,把字符串转换成了json对象,所以第16行输出Object { b=3},第17行输出3。
是不是这样呢,看看结果吧:

三、Eval把json格式字符串转换为json对象为什么要加括号
这一点园子里有一篇文章讲得比较清楚(原文链接:eval和JSON),这里就不献丑了,这里直接用原文的话来说明。加上圆括号的目的是迫使eval函数在评估JavaScript代码的时候强制将括号内的表达式(expression)转化为对象,而不是作为语句(statement)来执行。举一个例子,例如对象字面量{},如若不加外层的括号,那么eval会将大括号识别为JavaScript代码块的开始和结束标记,那么{}将会被认为是执行了一句空语句。所以下面两个执行结果是不同的:
code 2:
1 alert(eval("{}"); // return undefined
2 alert(eval("({})");// return object[Object]
所以,code 1中第15行要加上括号,如果不加会怎么样呢,大家可以测试一下。关于这一点,大家可以类比一下SQL语句,当一个子查询结果要做为关联表用时,会在查询语句两边加上括号,如:
code 3:
selecttop10*from TB where ID notin (selecttop5 ID from TB)
四、jquery中ajax返回值的处理
用eval把字符串转换为json对象用的最多的地方就是在ajax中。ajax的返回值有些是json格式的字符串,所以要用eval('('+返回的json格式字符串+')')来转换,这样写一般是没有问题的,但现在有很多是用jquery中的ajax方法来做的,jquery的强大也让很多人在用时容易忽略一些问题,比较常见的就是contentType跟dataType,contentType与本文没什么关系,这里只说说dataType参数。
dataType可用的类型有xml,html,script,json,jsonp,text,用的比较多的是xml,json,text。有些朋友在用时不管dataType是什么类型,都把返回值eval一下,有时碰巧对了,有时错了就不知道问题出在哪儿,一筹莫展。
dataType是预期服务器返回的数据类型,如果不指定jQuery将自动根据HTTP包MIME信息返回responseXML或responseText。也就是说如果你dataType写的是json格式,jQuery在返回时已经把返回值转换成了json对象,这时就不需要再用eval转换了,如果dataType写的是text才需要用eval转换。
转载自:artwl http://www.cnblogs.com/artwl/archive/2011/09/07/2169680.html
浅入浅出JS中的eval及json的更多相关文章
- 包学会之浅入浅出Vue.js:结业篇(转)
蔡述雄,现腾讯用户体验设计部QQ空间高级UI工程师.智图图片优化系统首席工程师,曾参与<众妙之门>书籍的翻译工作.目前专注前端图片优化与新技术的探研. 在第一篇<包学会之浅入浅出Vu ...
- 包学会之浅入浅出Vue.js:升学篇
包学会之浅入浅出Vue.js:升学篇 蔡述雄,现腾讯用户体验设计部QQ空间高级UI工程师.智图图片优化系统首席工程师,曾参与<众妙之门>书籍的翻译工作.目前专注前端图片优化与新技术的探研. ...
- 包学会之浅入浅出Vue.js:开学篇(转)
包学会之浅入浅出Vue.js:开学篇 蔡述雄,现腾讯用户体验设计部QQ空间高级UI工程师.智图图片优化系统首席工程师,曾参与<众妙之门>书籍的翻译工作.目前专注前端图片优化与新技术的探研. ...
- 包学会之浅入浅出Vue.js:结业篇
在第一篇<包学会之浅入浅出Vue.js:开学篇>和上一篇<包学会之浅入浅出Vue.js:升学篇>的学习中,我们首先了解了Vue环境的搭建以及两个重要思想——路由和组件的学习,通 ...
- 浅入深出之Java集合框架(中)
Java中的集合框架(中) 由于Java中的集合框架的内容比较多,在这里分为三个部分介绍Java的集合框架,内容是从浅到深,如果已经有java基础的小伙伴可以直接跳到<浅入深出之Java集合框架 ...
- 『浅入深出』MySQL 中事务的实现
在关系型数据库中,事务的重要性不言而喻,只要对数据库稍有了解的人都知道事务具有 ACID 四个基本属性,而我们不知道的可能就是数据库是如何实现这四个属性的:在这篇文章中,我们将对事务的实现进行分析,尝 ...
- 浅入浅出---JQuery究竟是什么?
学习完了JQuery之后.我便感觉云里雾里的,JQuery究竟是什么.朦朦胧胧感觉到JQuery应该是javascript函数的封装.就应该像WinForm窗口应用程序中能够调用的系统函数,据之前所学 ...
- 浅入深出Vue:第一个页面
今天正式开始入门篇,也就是实战了~ 首先我们是要做一个博客网站,UI 框架采用江湖传闻中的 ElementUI,今天我们就来利用它确定我们博客网站的基本布局吧. 准备工作 新建一个vue项目(可以参考 ...
- 浅入深出Vue:代码整洁之封装
深入浅出vue系列文章已经更新过半了,在入门篇中我们实践了一个小小的项目. <代码整洁之道>一书中提到过一句话: 神在细节中 这句话来自20世纪中期注明现代建筑大师 路德维希·密斯·范·德 ...
随机推荐
- 网站优化不等于搜索引擎优化SEO
对于SEO相信搞网络营销的人基本上都知道这个名词,英文全称为search engine optimization,中文一般叫搜索引擎优化,也有的叫搜索引擎定位(Search Engine Positi ...
- windows平台mysql密码破解设置
windows平台下,5.7版本mysql,破解密码的两种方式: #1 关闭mysql服务net stop mysql 启动mysql服务 跳过权限 #2 在cmd中执行:mysqld --skip- ...
- Python json pickle 模块 区别
json 支持 str.list.dict.int.tuple 数据类型 pickle 支持Python所有里的所有数据类型 缺点: 只能在Python使用 总结: 1.JSON只能处理基本数据类型. ...
- PHPExcel 基本用法详解
.header header("Content-Type:application/vnd.ms-excel"); header("Content-Disposition: ...
- Legal or Not(模板题)
本来以为这题能用并查集做的,但一想不对 例如A-> B,A->C如果用并查集的话B与C就不能连了,但实际B可以是C的徒弟,所以这题是考拓扑排序. #include<stdio.h&g ...
- python的三种字符串格式化方法
1.最方便的 print 'hello %s and %s' % ('df', 'another df') 但是,有时候,我们有很多的参数要进行格式化,这个时候,一个一个一一对应就有点麻烦了,于是就有 ...
- Java互联网架构-Mysql分库分表订单生成系统实战分析
概述 分库分表的必要性 首先我们来了解一下为什么要做分库分表.在我们的业务(web应用)中,关系型数据库本身比较容易成为系统性能瓶颈,单机存储容量.连接数.处理能力等都很有限,数据库本身的“有状态性” ...
- Java设计模式应用——观察者模式
告警结果产生后,可能需要发送短信,邮件,故障管理系统.这些转发操作不应当影响告警生成入库,并且类似事件可能根据不同场景,客户习惯不同,此时,使用观察者模式则可以很好的适应上述场景. 观察者模式应当包括 ...
- fiddler——一款莱斯的抓包工具
进行页面和接口调试时候,好使得抓包工具还是有作用得,如postman,fiddler,相比,postman更适合用来接口调试和与其他人一起联调,而抓包监控web得时候我更喜欢用fiddler: 当然, ...
- ajax请求为异步操作时,返回的数据不会被并列函数执行
ajax请求为异步操作时,返回的数据不会被并列函数执行