eval()、window.eval()和with

原创 2015年11月20日 10:27:03

eval()和window.eval()都可以用来动态执行javascript代码,能给js编程带来很大的灵活性,两者唯一的差别在于执行上下文不同。

function testEval() {
	eval("var strEval = 'local';");
}

function testWindowEval() {
	window.eval("var strWindowEval = 'global';");
}

testEval();
testWindowEval();
alert(strWindowEval); //global
alert(strEval); //Uncaught ReferenceError: strEval is not defined

可以看到:window.eval()的执行上下文是“全局对象”,而eval()的执行上下文则是“调用eval的上下文环境”。现在我们看下,与eval有关的代码。

代码1:

var str = "global";

function test() {
	alert(str); //undefined
	var str = "local";
}

test();
alert(str); //global
如果你了解var关键字的"提前声明"特性,上面这段代码的执行结果很好理解。如果不明白,可以参考这篇文章

代码2:

var str = "global";

function test() {
	alert(str); //global
	eval("var str='local';");
	//var str = "local";
	alert(str); //local
}

test();
alert(str); //global


eval和window.eval也存在浏览器兼容性问题,这里直接附上结论,摘录自这篇文章
IE6/7/8中,eval和window.eval一样,写在自定义函数内是局部闭包,否则是全局闭包。
IE9/Firefox/Safari/Chrome/Opera中,eval同以上IE6/7/8,
window.eval即使写在自定义函数内使用的也是全局闭包。

下面介绍下with,with为一条或一组语句指定默认对象,通常用来缩短代码量。
var obj = {name:"aty",age:"25"};
with(obj)
{
	alert("name="+name+",age="+age);
}


最近我在搞JsonSQL的时候,学习到了with另一个很重要的性质:改变with内语句的执行上下文。

举个例子:假如我们有一个data数组,一个condition语句(js语句),现在需要按照condition过滤data。

var data = [
	{name:"aa",age:20},
	{name:"bb",age:40},
	{name:"cc",age:10}];

var condition = "name=='bb' || age == 20";

var filter = [];
var counter = 0;

for(var i=0; i < data.length; i++)
{
	with(data[i])
	{
		if(eval(condition))
		{
			filter[counter++] = data[i];
		}
	}
}

alert(JSON.stringify(filter));

你可以细细品味下上面这段代码,我觉得这是eval和with很经典的一个配合。


再看下面代码,了解下with执行过程中,作用域链的创建和恢复。

function withTest() {
	var name = "aty";
	
	var obj = {name : "temp"};
	//暂时修改作用域链
	with (obj) {
		alert(name);//temp
	}//with内的语句执行完之后,作用域链恢复原状

	alert(name);//aty
}
withTest();

参考文章:

eval与window.eval的差别
http://www.cnblogs.com/snandy/archive/2011/03/16/1986055.html

javascript的eval和with使用小结
http://www.cnblogs.com/jeffwongishandsome/archive/2009/07/14/1509780.html

版权声明:本文为博主原创文章,未经博主允许不得转载。

js中执行脚本字符串方法:window.eval()/eval()

它们之间有区别吗?开发过程中似乎很少有人去加个额外的window,觉得多此一举。比如ajax过程中回调函数解析json格式字符串:   Js代码   ...  function ...
  • superdog007
  • superdog007
  • 2014年04月17日 16:41
  • 4846

eval与window.eval的差别

它们之间有区别吗? 开发过程中似乎很少有人去加个额外的window,觉得多此一举。比如Ajax过程中回调函数解析JSON格式字符串 ? 1 2 3 4 5 ... function...
  • lvjin110
  • lvjin110
  • 2013年09月23日 15:08
  • 1257

JS window eval and load script!

var globalEval = function globalEval(src) { if (window.execScript) { window.execScript(s...
  • yangzhihello
  • yangzhihello
  • 2014年06月04日 09:46
  • 1138

Webpack傻瓜指南(二)开发和部署技巧

Webpack傻瓜指南(二)开发和部署技巧 张轩 · 1 年前 注意啦:如果你还没有看第一篇 请先看下第一篇的基础知识:Webpack傻瓜式指南(一) - 前端外刊评论 - 知乎专栏 ...
  • yzbben
  • yzbben
  • 2017年01月16日 17:42
  • 1503

openwrt源码框架解析

本篇的主要目的是想通过分析Makefile,了解openwrt编译过程。着重关注以下几点: openwrt目录结构 主Makefile的解析过程,各子目录的目标生成。 kernel编译过程 ...
  • clirus
  • clirus
  • 2016年01月11日 15:00
  • 4765

eval和with对性能的影响

javascript中使用eval和with一直被认为是一个不好的主意,他们对性能的影响是很大的,在说明性能之前我们先看看这两种机制都是什么样子的。evaljavascript中的eval函数可以接受...
  • cslove9
  • cslove9
  • 2017年01月01日 10:48
  • 161

eval和window.eval

javascript中的 eval 函数可以接受一个字符串为参数,并将其中的内容视为好像在书写时就存在于程序中这个位置一样。 function foo(str, a) { eval(str);  ...
  • jianlu_blet
  • jianlu_blet
  • 2018年02月02日 21:06
  • 9

前端经典代码

作为一名程序员,每天坐在电脑前敲敲打打那些重复重复再重复的语句,习惯性的思维总是被套进去,有些时候很容易把简单的事情想复杂了!不过,我们反其道而行之,新手们只要是把下面的语句牢记,很多情况下都是会事半...
  • qq_39894133
  • qq_39894133
  • 2018年01月18日 11:01
  • 15

webpack指南

webpack指南:https://webpack.toobug.net/zh-cn/ https://doc.webpack-china.org/guides/migrating/ webpac...
  • clayja
  • clayja
  • 2017年03月11日 17:35
  • 158

eval和window.eval的区别

 eval 方法在各浏览器都按照规范定义,根据当前代码上下文执行 eval 方法中的脚本,如果没有指定上下文,该脚本将在全局上下文中执行。   window.eval 方法,在 IE6 IE7 IE8...
  • xiaobai251206725
  • xiaobai251206725
  • 2010年11月08日 15:33
  • 457
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:eval()、window.eval()和with
举报原因:
原因补充:

(最多只允许输入30个字)