Javascript学习笔记4 Eval函数

eval的作用其实很简单，就是把一段字符串传递给JS解释器，由Javascript解释器将这段字符串解释成Javascript代码，并且执行他。
举个最简单的例子：


代码如下:

<script type="text/javascript">
eval("alert(1+1)");
</script>

很简单，把字符串解释成JS代码并执行，弹出2。
当然，上面的例子只是个玩具，在实际中没有人会傻到这么用。我想大家最基本的使用eval函数都是应该在DOM中，例如我们有div1,div2,div3，那么在document.getElementByID时我们的ID没有办法去得到，那么最简单的办法就是在for循环中，使用eval来拼接这么一段程序。例如这样：


代码如下:

<script type="text/javascript">
for (var loop = 1; loop < 10; loop++) {
eval('document.getElementById("div"+loop).innerHTML="123"');
}
</script>

最基本的用法说完，相信大家还是对这个函数意犹未尽，如果这个函数只有这么点用法，那就太无聊了。那我们就一点点来剖下一下eval()函数。
我们就先从eval的作用域说起，先看这样一段函数：


代码如下:

<script type="text/javascript">
eval("var i=3");
alert(i);
</script>

代码很简单，结果可以弹出3。接下来再对比这段代码：


代码如下:

<script type="text/javascript">
var test = function () {
eval("var i=3");
alert(i);
}
test();
alert(i);
</script>

结果是首先弹出3，然后是undefined。
那么说明：eval()函数动态执行的代码并不会创建新的作用域，其代码就是在当前的作用域执行的。因此也就是说，eval()函数也完全可以使用当前作用域的this,argument等对象。
在IE中，支持这样一种和eval()非常类似的函数叫做：execScript()。我们可以来写段简单的代码。


代码如下:

<script type="text/javascript">
var test = function () {
execScript("var i=3");
alert(i);
}
test();
alert(i);
</script>

结果弹出了2个3，这也就看出了execScript函数的特点，首先他和eval相类似，都能将字符串解释成JS代码并且执行，但是他的作用域不是当前作用域，而是全局作用域。当我们把上面的代码放到Firefox和谷歌浏览器上去试试：发现在Firefox上execScript上代码是无效的，那么也说明一个问题，execScript代码的浏览器兼容性是有问题的。
那么就引申出这样一个问题，我们如何能把这两个函数的“优点”给汇总到一起呢，也就是说，全局+浏览器兼容性。上网搜了下，自己给汇总了一下，大概是这样：


代码如下:

<script type="text/javascript">
var StrongEval = function (code) {
if (window.navigator.userAgent.indexOf("MSIE") >= 1) {
execScript(code);
}
if (window.navigator.userAgent.indexOf("Firefox") >= 1) {
window.eval(code);
}
else {
execScript(code);
}
};
var Test = function () {
StrongEval("var i=3");
}
Test();
alert(i);
</script>

这样就可以完美地兼容FF和IE了，其本质代码就在于在FF中eval和window.eval并不等效，这是个很奇妙的事。
另外，我们还可以用eval+with实现一些奇淫技巧。
我们在一般意义上可以写出这样的代码：


代码如下:

var obj = function () {
this.a = 1;
this.b = 2;
this.c = 5;
this.fun = function () {
this.c = this.a + this.b;
}
};
var o = new obj();
o.fun();
alert(o.c);

或者是这样：


代码如下:

var obj = {
a: 1,
b: 2,
c: 5,
fun: function () {
this.c = this.a + this.b;
}
}

再或者是这样：


代码如下:

var obj = function () {
this.a = 1;
this.b = 2;
this.c = 5;
};
obj.prototype.fun = function () {
this.c = this.a + this.b;
}
var o = new obj();
o.fun();
alert(o.c);

无论怎么样，你是不是对这样的this感觉厌烦了呢？那就让我们采取个很另类的办法吧，让至少在感官上可能会舒服一点。


代码如下:

<script type="text/javascript">
var funtemp = function () {
c = a + b;
}
var obj = {
a: 1,
b: 2,
c: 5
};
var fun;
with (obj) {
eval("fun = " + funtemp);
}
fun();
alert(obj.c);
</script>

这个很勉强，那么好，我们不讨论什么看着舒服不舒服。我们来讨论这样一种情况。


代码如下:

<script>
var DBCommon = function () {
alert("1."); CreateConnection();
alert("2."); OpenConnection();
alert("3."); CreateCommand();
alert("4."); ExcuteCommand();
alert("5."); CloseConnection();
}
var SQLServerCommon = {
CreateConnection: function () { alert("建立SQL Server连接"); },
OpenConnection: function () { alert("打开SQL Server连接"); },
CreateCommand: function () { alert("创建¨SQL Server命令"); },
ExcuteCommand: function () { alert("执行DSQL Server命令"); },
CloseConnection: function () { alert("关闭SQL Server连接"); }
};
var OracleCommon = {
CreateConnection: function () { alert("建立￠Oracle连接"); },
OpenConnection: function () { alert("打开aOracle连接"); },
CreateCommand: function () { alert("创建¨Oracle命令"); },
ExcuteCommand: function () { alert("执行DOracle命令"); },
CloseConnection: function () { alert("关闭?Oracle连接"); }
};
with (SQLServerCommon) {
eval("forSQLServer=" + DBCommon);
}
with (OracleCommon) {
eval("forOracle=" + DBCommon);
}
forSQLServer();
forOracle();
</script>

我们又是否可以把这个看成是一个简陋的模板方法模式呢？呵呵。我们也可以把这个称为利用eval和with配合改变函数的上下文。
不过话又说回来，Eval在一般的情况中是很少被用到的，我们是完全可以避免来使用它的。

赞 (0)

相关推荐

  • JavaScript Eval 函数使用

    值得注意的 当传入是Json类型的时候要var user = eval(result.d); 当传入是字符串的时候要用eval("exception = "+result.responseText); 复制代码 代码如下: $.ajax ( { type: "POST", contentType: "application/json", url: serviceURL+"/UserLogin", data: "{Us

  • Javascript中Eval函数的使用

    [eval()函数] JavaScript有许多小窍门来使编程更加容易. 其中之一就是eval()函数,这个函数可以把一个字符串当作一个JavaScript表达式一样去执行它. 举个小例子: 复制代码 代码如下: var the_unevaled_answer = "2 + 3"; var the_evaled_answer = eval("2 + 3"); alert("the un-evaled answer is " + the_uneva

  • javascript eval函数深入认识

    (1)介绍javascript中的eval函数的用法 (2)如何在函数内执行全局代码 ►先来说eval的用法,内容比较简单,熟悉的可以跳过. eval函数接收一个参数s,如果s不是字符串,则直接返回s.否则执行s语句.如果s语句执行结果是一个值,则返回此值,否则返回undefined. 需要特别注意的是对象声明语法"{}"并不能返回一个值,需要用括号括起来才会返回值,简单示例如下: var code1='"a" + 2'; //表达式 var code2='{a:2

  • javascript eval()用法

    简单的说,可以把字符串转换成表达式并返回执行结果 eval 方法 请参阅 String 对象 应用于: Global 对象 要求 版本 1 检查 JScript 代码并执行. eval(codeString) 必选项 codestring 参数是包含有效 JScript 代码的字符串值.这个字符串将由 JScript 分析器进行分析和执行. 说明 eval 函数允许 JScript 源代码的动态执行.例如,下面的代码创建了一个包含 Date 对象的新变量 mydate : eval("var m

  • Javascript中Eval函数的使用说明

    举个小例子: 复制代码 代码如下: var the_unevaled_answer = "2 + 3"; var the_evaled_answer = eval("2 + 3"); alert("the un-evaled answer is " + the_unevaled_answer + " and the evaled answer is " + the_evaled_answer); 如果你运行这段eval程序,

  • JavaScript中的eval()函数详解

    eval("1+2"),-> 3 动态判断源代码中的字符串是一种很强大的语言特性,几乎没有必要在实际中应用.如果你使用了eval(),你应当仔细考虑是否真的需要使用它. 一.eval()是一个函数还是一个运算符 eval()是一个函数,但由于它已经被当成运算符来对待了..JavaScript语言的早期版本定义了eval函数,现代JavaScript解释器进行了大量的代码分析和优化.而eval的问题在于,用于动态执行的代码通常来讲不能分析,换句话说,如果一个函数调用了eval,那么

  • Javascript学习笔记4 Eval函数

    eval的作用其实很简单,就是把一段字符串传递给JS解释器,由Javascript解释器将这段字符串解释成Javascript代码,并且执行他. 举个最简单的例子: 复制代码 代码如下: <script type="text/javascript"> eval("alert(1+1)"); </script> 很简单,把字符串解释成JS代码并执行,弹出2. 当然,上面的例子只是个玩具,在实际中没有人会傻到这么用.我想大家最基本的使用eval函

  • JavaScript学习笔记之惰性函数示例详解

    前言 本文主要给大家介绍了关于JavaScript惰性函数的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧. 需求 我们现在需要写一个 foo 函数,这个函数返回首次调用时的 Date 对象,注意是首次. 解决一:普通方法 var t; function foo() { if (t) return t; t = new Date() return t; } 问题有两个,一是污染了全局变量,二是每次调用 foo 的时候都需要进行一次判断. 解决二:闭包 我们很容易想到用闭

  • JavaScript学习笔记之JS函数

    函数就是包裹在花括号中的代码块,前面使用了关键词function: 复制代码 代码如下: function functionName() {     这里是要执行的代码 } 函数参数 函数的参数可以任意多个,不用声明变量类型,只用给出变量名: 复制代码 代码如下: function myFunction(name, job) {     这里是要执行的代码 } 函数返回值 在函数中使用return语句,函数会停止执行,返回调用它的地方. 函数的返回值也不用声明类型,直接返回即可. 复制代码 代码

  • javascript学习笔记(七) js函数介绍

    1.函数内部属性 arguments arguments用来保存函数的参数,arguments.callee指向拥有arguments对象的函数 复制代码 代码如下: //阶乘 function factorial(num) { if (num <= 1) { return 1; } else { return num*arguments.callee(num-1); //用agreements.callee代替 } } var trueFactorial = factorial; factor

  • javascript学习笔记（四）function函数部分

    函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块. Jscript 支持两种函数:一类是语言内部的函数(如eval() ),另一类是自己创建的. 在 JavaScript 函数内部声明的变量(使用 var)是局部变量,所以只能在函数内部访问它.(该变量的作用域是局部的). 您可以在不同的函数中使用名称相同的局部变量,因为只有声明过该变量的函数才能识别出该变量. 函数的调用方式 1.普通调用:functionName(实际参数...) 2.通过指向函数的变量去调用: var  myVar

  • JavaScript学习笔记(三)：JavaScript也有入口Main函数

    在C和Java中,都有一个程序的入口函数或方法,即main函数或main方法.而在JavaScript中,程序是从JS源文件的头部开始运行的.但是某种意义上,我们仍然可以虚构出一个main函数来作为程序的起点,这样一来不仅可以跟其他语言统一了,而且说不定你会对JS有更深的理解. 1. 实际的入口 当把一个JavaScript文件交给JS引擎执行时,JS引擎就是从上到下逐条执行每条语句的,直到执行完所有代码. 2. 作用域链.全局作用域和全局对象 我们知道,JS中的每个函数在执行时都会产生一个新的

  • JavaScript学习笔记之取值函数getter与取值函数setter详解

    JavaScript学习笔记之取值函数getter与取值函数setter详解

    目录 取值函数getter和存值函数setter 使用get与set函数有两个好处 取值函数getter和存值函数setter get和set是两个关键字,用于对某个属性设置存值函数和取值函数,拦截该属性的存取行为. 那么,这两个东西要怎么用呢?而且他们和我们的平日里写的业务又是怎么练习起来的呢? 首先,我们先看一段恩简单的代码: var person={ myname:'' } person.myname='lsh' console.log(person.myname); 相信大家一眼就看出来

  • JavaScript学习笔记整理_setTimeout的应用

    setTimeou的t应用 var ids = []; function foo1(i) { this.i = i; console.log('i = '+i); ids[0] = setTimeout((function () { foo1(i); }),1000); } function foo2(j) { this.j = j; console.log('j = '+j); ids[1] = setTimeout((function () { foo2(j); }),1000); } fo

  • JavaScript学习笔记整理_关于表达式和语句

    表达式和语句 eval( ) 只有一个参数 参数非字符串时,直接返回这个参数: 参数为字符串时,它把字符串当成JavaScript代码进行编译,编译失败则抛出语法错误,编译成功则执行代码,并返回最后一条语句的值,若没有值则返回undefined eval()使用了调用它的变量的作用域环境 它接收的字符串参数,在作为单独的代码时,必须是有语义的,否则编译失败 delete运算符:用来删除对象的自由属性.数组的元素, 删除属性后,属性将不存在,而删除数组元素后,会在数组内留下一个值为undefine

  • JavaScript学习笔记之创建对象

    JavaScript 有Date.Array.String等这样的内置对象,功能强大使用简单,人见人爱,但在处理一些复杂的逻辑的时候,内置对象就很无力了,往往需要开发者自定义对象. 从JavaScript定义上讲对象是无序属性的集合,其属性可以包含基本值.对象或函数.也就是说对象是一组没有特定顺序的属性,每个属性会映射到一个值上,是一组键值对,值可以是数据或对象. 对象是JavaScript的基本数据类型.在JavaScript中除了字符串.数字.true.false.null和undefine

随机推荐