javascript eval(func())使用示例

更新時間：2013年12月05日 17:23:40 投稿：whsnow

eval的作用其實很簡單，就是把一段字符串傳遞給JS解釋器，由Javascript解釋器將這段字符串解釋成Javascript代碼，下面有個不錯的示例，感興趣的朋友可以參考下

eval的作用其實很簡單，就是把一段字符串傳遞給JS解釋器，由Javascript解釋器將這段字符串解釋成Javascript代碼，并且執(zhí)行他。

舉個最簡單的例子：

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

很簡單，把字符串解釋成JS代碼并執(zhí)行，彈出2。

當然，上面的例子只是個玩具，在實際中沒有人會傻到這么用。我想大家最基本的使用eval函數(shù)都是應該在DOM中，例如我們有div1,div2,div3，那么在document.getElementByID時我們的ID沒有辦法去得到，那么最簡單的辦法就是在for循環(huán)中，使用eval來拼接這么一段程序。例如這樣：

復制代碼代碼如下:

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

最基本的用法說完，相信大家還是對這個函數(shù)意猶未盡，如果這個函數(shù)只有這么點用法，那就太無聊了。那我們就一點點來剖下一下eval()函數(shù)。

我們就先從eval的作用域說起，先看這樣一段函數(shù)：

復制代碼代碼如下:

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

代碼很簡單，結(jié)果可以彈出3。接下來再對比這段代碼：

復制代碼代碼如下:

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

結(jié)果是首先彈出3，然后是undefined。

那么說明：eval()函數(shù)動態(tài)執(zhí)行的代碼并不會創(chuàng)建新的作用域，其代碼就是在當前的作用域執(zhí)行的。因此也就是說，eval()函數(shù)也完全可以使用當前作用域的this,argument等對象。

在IE中，支持這樣一種和eval()非常類似的函數(shù)叫做：execScript()。我們可以來寫段簡單的代碼。

復制代碼代碼如下:

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

結(jié)果彈出了2個3，這也就看出了execScript函數(shù)的特點，首先他和eval相類似，都能將字符串解釋成JS代碼并且執(zhí)行，但是他的作用域不是當前作用域，而是全局作用域。當我們把上面的代碼放到Firefox和谷歌瀏覽器上去試試：發(fā)現(xiàn)在Firefox上execScript上代碼是無效的，那么也說明一個問題，execScript代碼的瀏覽器兼容性是有問題的。

那么就引申出這樣一個問題，我們?nèi)绾文馨堰@兩個函數(shù)的“優(yōu)點”給匯總到一起呢，也就是說，全局+瀏覽器兼容性。上網(wǎng)搜了下，自己給匯總了一下，大概是這樣：

復制代碼代碼如下:

<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了，其本質(zhì)代碼就在于在FF中eval和window.eval并不等效，這是個很奇妙的事。
我們在一般意義上可以寫出這樣的代碼：

復制代碼代碼如下:

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("創(chuàng)建¨SQL Server命令"); },
ExcuteCommand: function () { alert("執(zhí)行DSQL Server命令"); },
CloseConnection: function () { alert("關(guān)閉SQL Server連接"); }
};
var OracleCommon = {
CreateConnection: function () { alert("建立￠Oracle連接"); },
OpenConnection: function () { alert("打開aOracle連接"); },
CreateCommand: function () { alert("創(chuàng)建¨Oracle命令"); },
ExcuteCommand: function () { alert("執(zhí)行DOracle命令"); },
CloseConnection: function () { alert("關(guān)閉?Oracle連接"); }
};
with (SQLServerCommon) {
eval("forSQLServer=" + DBCommon);
}
with (OracleCommon) {
eval("forOracle=" + DBCommon);
}
forSQLServer();
forOracle();
script>