JavaScript中的eval()函数使用介绍


Posted in Javascript onDecember 31, 2014

在JavaScript中,可以使用eval()函数来解析字符串中的JavaScript代码,并返回相应的代码执行结果:

console.log(eval("42 * 2"));//84

就本质而言,eval()是JavaScript全局对象的一个函数。比如,上述代码等价于:

console.log(this.eval("42 * 2"));//84

不过在使用eval()语句时,一般都采用上述第一种做法,也即忽略全局对象直接使用eval()。

eval()的使用

基于以下两个原因,除非确实需要,不然应尽量避免在代码中使用eval()语句:

1.从逻辑上来说,字符串应该用于储存程序运行过程中的内容、信息,而不应该用于储存具体的计算逻辑。
2.由于eval()参数为字符串,而对于一段字符串无法词法进行,因此对于eval()调用语句,JavaScript解释器无法进行优化。

eval()的返回值

eval()的返回值遵循以下规则:

1.如果eval()的参数不是字符串,那么eval()将直接返回参数。
2.如果eval()的参数是字符串,那么eval()将这个字符串解析成代码后进行执行,并返回最后一行代码执行的结果。
3.如果字符串无法解析成合法的代码,eval()将抛出SyntaxError错误。
4.如果字符串能够被解析成合法的代码,但是在执行这一代码过程中报错,那么这个错误会上报给eval()语句,并由eval()抛出。

console.log(eval([1,2,3]));//[1, 2, 3]

console.log(typeof eval([1,2,3]));//object
console.log(eval("42 */ 2"));//SyntaxError

console.log(eval("42 * 2; 22 * 3;"));//66. eval returns the result of last expression/statement

console.log(eval("null.toString()"));//TypeError, exception in eval-ed code will be propagated outside eval().

变量环境(variable environment)

JavaScript中eval()有一个重要的特性:eval()参数字符串中的代码可以访问外部代码中的变量,同时也可以将参数字符串代码中新建的变量暴露给外部代码。也即,如果eval()参数字符串可以被合法解析,那么JS会将解析后的代码替换掉eval()所在的那一行:

//variable environment

var a = 108;

console.log(eval("function double(x){return x*2;} a = double(a)"));

console.log(a);//216

console.log(double(33));//66

值得注意的是,实现上述特性的前提是eval()参数字符串中的代码可以被合法解析。除了代码语法正确外,JS还要求eval()参数字符串中的代码必须“自成一体”:仅就参数字符串中的代码而言,代码必须是有意义的。比如,无法将诸如“return;”这样的字符串传给eval()函数:

function test(){

  var s = "test";

  eval("return s;");

}

test();//SyntaxError: return not in function

如果直接使用eval()函数,那么eval()参数字符串中的代码所访问的变量是eval()语句所在function的那些变量,也即eval()函数所使用的变量环境是“本地变量环境”。如果不直接使用eval()函数,而是使用一个同样指向eval()函数的新变量,那么相应参数字符串中的代码所访问的变量均为全局变量,也即eval()函数所使用的变量环境是“全局变量环境”:

//local variable environment and global variable environment

var renamed = eval;

var x = "origin", y = "origin";

function f(){

  var x = "new";

  eval("x += 'Changed';");

  return x;

}

function g(){

  var y = "new";

  renamed("y += 'Changed';");

  return y;

}

console.log(f(), x);//newChanged origin

console.log(g(), y);//new originChanged

不过,值得注意的是,IE6、7、8中的行为与此不同。在IE6、7、8中,即使eval()函数被重命名,所使用的也依然是“本地变量环境”。

Javascript 相关文章推荐
javascript中的107个基础知识收集整理 推荐
Mar 29 Javascript
判断客户端浏览器是否安装了Flash插件的多种方法
Aug 11 Javascript
json中换行符的处理方法示例介绍
Jun 10 Javascript
JavaScript SweetAlert插件实现超酷消息警告框
Jan 28 Javascript
Bootstrap源码解读网格系统(3)
Dec 22 Javascript
Vuex之理解Mutations的用法实例
Apr 19 Javascript
JS动画定时器知识总结
Mar 23 Javascript
web页面和微信小程序页面实现瀑布流效果
Sep 26 Javascript
vue基础之使用get、post、jsonp实现交互功能示例
Mar 12 Javascript
详解微信小程序用定时器实现倒计时效果
Apr 30 Javascript
vue基于better-scroll仿京东分类列表
Jun 30 Javascript
javascript实现贪吃蛇小练习
Jul 05 Javascript
JSONP跨域GET请求解决Ajax跨域访问问题
Dec 31 #Javascript
JavaScript中的异常捕捉介绍
Dec 31 #Javascript
JavaScript中对象介绍
Dec 31 #Javascript
JavaScript中用字面量创建对象介绍
Dec 31 #Javascript
javascript设计模式之中介者模式Mediator
Dec 30 #Javascript
javascript实现window.print()去除页眉页脚
Dec 30 #Javascript
Javascript访问器属性实例分析
Dec 30 #Javascript
You might like
PHP初学者头疼问题总结
2006/07/08 PHP
如何使用PHP批量去除文件UTF8 BOM信息
2013/08/05 PHP
php+xml实现在线英文词典之添加词条的方法
2015/01/23 PHP
PHP获取一年中每个星期的开始和结束日期的方法
2015/02/12 PHP
php中instanceof 与 is_a()区别分析
2015/03/03 PHP
CI框架数据库查询缓存优化的方法
2016/11/21 PHP
prototype Element学习笔记(Element篇三)
2008/10/26 Javascript
jquery $.ajax入门应用一
2008/11/19 Javascript
从JavaScript 到 JQuery (1)学习小结
2009/02/12 Javascript
IE与Firefox在JavaScript上的7个不同写法小结
2009/09/14 Javascript
autoPlay 基于jquery的图片自动播放效果
2011/12/07 Javascript
解析John Resig Simple JavaScript Inheritance代码
2012/12/03 Javascript
Jquery.addClass始终无效原因分析
2013/09/08 Javascript
了解Javascript的模块化开发
2015/03/02 Javascript
jquery选择器简述
2015/08/31 Javascript
Vue2.0使用过程常见的一些问题总结学习
2017/04/10 Javascript
vue router路由嵌套不显示问题的解决方法
2017/06/17 Javascript
ztree简介_动力节点Java学院整理
2017/07/19 Javascript
nodejs调取微信收货地址的方法
2017/12/20 NodeJs
VUE Error: getaddrinfo ENOTFOUND localhost
2018/05/03 Javascript
Vue.js 中 axios 跨域访问错误问题及解决方法
2018/11/21 Javascript
解决python升级引起的pip执行错误的问题
2018/06/12 Python
Python实现九宫格式的朋友圈功能内附“马云”朋友圈
2019/05/07 Python
使用NumPy读取MNIST数据的实现代码示例
2019/11/20 Python
在Python中使用MongoEngine操作数据库教程实例
2019/12/03 Python
Tensorflow分批量读取数据教程
2020/02/07 Python
Python3使用腾讯云文字识别(腾讯OCR)提取图片中的文字内容实例详解
2020/02/18 Python
浅谈keras 模型用于预测时的注意事项
2020/06/27 Python
利用Python将图片中扭曲矩形的复原
2020/09/07 Python
python调用百度API实现人脸识别
2020/11/17 Python
用CSS3实现无限循环的无缝滚动的实例代码
2017/07/04 HTML / CSS
Farfetch香港官网:汇集全球时尚奢侈品购物平台
2017/11/26 全球购物
网络工程师面试(三木通信技术有限公司)
2013/06/05 面试题
优秀毕业生推荐信
2013/11/02 职场文书
学习保证书怎么写
2015/02/26 职场文书
财务人员入职担保书
2015/09/22 职场文书