javascript中eval和with用法實(shí)例總結(jié)
本文實(shí)例講述了javascript中eval和with用法。分享給大家供大家參考,具體如下:
我們都知道javascript的作用域機(jī)制,但是with和eval有時(shí)會(huì)“破壞”我們對(duì)于作用域的常規(guī)理解。下面參考網(wǎng)上資源和自己理解總結(jié)一下eval和with的用法。
一、eval
1、eval函數(shù):把一個(gè)字符串當(dāng)作一個(gè)js表達(dá)式一樣去執(zhí)行它.
2、語(yǔ)法:eval(strScript) 注:參數(shù)strScript是必填項(xiàng)
3、使用說(shuō)明
(1)它是有返回值的,如果參數(shù)字符串是一個(gè)表達(dá)式,就會(huì)返回表達(dá)式的值。如果參數(shù)字符串不是表達(dá)式,沒(méi)有值,那么返回“undefined”。
(2)參數(shù)字符串作為代碼執(zhí)行時(shí),是和調(diào)用eval函數(shù)的上下文相關(guān)的,即其中出現(xiàn)的變量或函數(shù)調(diào)用必須在調(diào)用eval的上下文環(huán)境中可用。
4、示例:
function $(s) { if (document.getElementById) { return eval('document.getElementById("' + s + '")'); } else { return eval('document.all.' + s); } } //eval,這個(gè)比較常用
var myTest = function() { return "eval test"; };
function evalTest() {
//簡(jiǎn)單數(shù)據(jù)
alert(eval("1+1")); //2
alert(eval("'a'+1")); //a1
alert(eval("1+'a'")); //1a
alert(eval("parseInt('a'+1)")); //NaN
alert(eval("parseInt(1+'a')")); //1
alert(eval("true")); //true
alert(eval("0==false")); //true
alert(eval("1==undefined")); //false
alert(eval("isNaN(undefined)")); //true
//函數(shù)和對(duì)象
alert(eval("this")); //[object]
alert(eval("typeof(this)")); //object
alert(eval("typeof(test)")); //undefined
alert(eval("evalTest")); //這個(gè)顯示當(dāng)前函數(shù)的定義語(yǔ)句細(xì)節(jié),包含注釋
//alert(eval("evalTest()")); //調(diào)用自己并執(zhí)行,這個(gè)會(huì)有大問(wèn)題啊!
alert(eval("typeof(evalTest)")); //function
//其他
var tmpFunc = "{a:1}";
alert(eval(tmpFunc)); //1
alert(eval("(" + tmpFunc + ")")); //[object object]
alert(eval("tmpFunc")); //{a:1}
//alert(eval("tmpFunc()")); //腳本錯(cuò)誤
alert(myTest());
eval("alert(myTest())"); //和上面等價(jià)
alert(eval(myTest));
alert(eval("myTest")); //和上面等價(jià)
//form里的一個(gè)input,id=txtUserName
eval("$('txtUserName').value='jeff wong';"); //等價(jià)于 $('txtUserName').value = 'jeff wong';
eval("alert( $('txtUserName').value);");
}
evalTest();
5、eval和作用域
(1)經(jīng)典代碼分析
a、常見(jiàn)
var str = "global";
function test() {
alert(str); //undefined
var str = "local";
}
test();
alert(str); //global
分析:如我們預(yù)期的那樣,得到指定值。test函數(shù)內(nèi)的str沒(méi)有var和有var聲明,結(jié)果也是不一樣的,讀者可自行驗(yàn)證。
b、eval替代直接聲明變量的寫(xiě)法
var str = "global";
function test() {
alert(str); //??
eval("var str='local';");//會(huì)像我們預(yù)期的那樣嗎?
//var str = "local";
alert(str); //這里又是什么結(jié)果?
}
test();
alert(str); //??
分析:對(duì)比a中的寫(xiě)法,我們只是在test函數(shù)里用eval語(yǔ)句替換直接聲明var定義變量那一句最后alert一下而已,結(jié)果出入很大。
(2)eval定義全局代碼
a、兼容ie和ff的通用定義全局代碼的eval函數(shù)
var nav = new Object();
//通用eval函數(shù)
nav.Eval = function(jsCode) {
if (document.all) //IE下是execScript
execScript(jsCode);
else window.eval(jsCode); //FF下是window.eval
}
對(duì)于IE瀏覽器,函數(shù)execScript用于在全局空間執(zhí)行代碼。
對(duì)于Firefox瀏覽器,直接調(diào)用eval函數(shù),則在調(diào)用者的空間執(zhí)行;如果調(diào)用window.eval則在全局空間執(zhí)行;但是alert(eval==window.eval)的返回值是true,奇怪的ff.
b、調(diào)用a的測(cè)試代碼
var nav = new Object();
//通用eval函數(shù)
nav.Eval = function(jsCode) {
if (document.all) //IE下是execScript
execScript(jsCode);
else window.eval(jsCode); //FF下是window.eval
}
function test() {
nav.Eval("var str = 'global';"); //這里聲明變量str,在外面的函數(shù)中可以調(diào)用變量
nav.Eval("var tmpFunc = function(){alert('global function');};"); //這里聲明函數(shù)變量tmpFunc,在外面的函數(shù)中可以調(diào)用函數(shù)
alert(str); //global
tmpFunc(); //global function
}
test();
alert(str); //global (調(diào)用nav.Eval函數(shù)聲明的全局變量)
tmpFunc(); // global function (調(diào)用nav.Eval函數(shù)聲明的全局函數(shù))
分析:通過(guò)b中的代碼,你可能已經(jīng)發(fā)現(xiàn)了eval定義全局代碼的一個(gè)顯而易見(jiàn)的不方便的地方,就是對(duì)于全局代碼,js智能提示(這里是vs,可能其他工具也會(huì))完全失去提示作用。由此你肯定會(huì)問(wèn),程序中通過(guò)eval這種方式定義了很多全局代碼,它的可維護(hù)性會(huì)不會(huì)太那個(gè)了?我的看法就是贊成網(wǎng)上的總結(jié),少用eval。畢竟現(xiàn)成的工具都不能很好的提示了,而程序員的視力往往又不是那么好。
二、with
1、with語(yǔ)句:為一個(gè)或一組語(yǔ)句指定默認(rèn)對(duì)象,通常用來(lái)縮短特定情形下必須寫(xiě)的代碼量。
2、語(yǔ)法:with (<對(duì)象>) <語(yǔ)句>
with (object)
statements
(1)參數(shù)object: 新的默認(rèn)對(duì)象;
(2)statements : 一個(gè)或多個(gè)語(yǔ)句,object 是該語(yǔ)句的默認(rèn)對(duì)象。
3、示例:
function withTest() {
with (document) { //document的重復(fù)使用
writeln("Hello,");
writeln("it's a with keyword test!");
}
with (Math) { //Math的重復(fù)使用
alert(random());
alert(abs(-10));
}
}
withTest();
4、with會(huì)暫時(shí)修改作用域鏈
function withTest() {
var userName = "jeff wong";
//暫時(shí)修改作用域鏈
with (document) {
writeln("Hello,");
writeln(userName);
}//with內(nèi)的語(yǔ)句執(zhí)行完之后,作用域鏈恢復(fù)原狀
alert(userName);
}
withTest();
分析: 函數(shù)withTest在定義的時(shí)候,就確定了withTest的作用域鏈,我們暫且認(rèn)為這條作用域鏈的最頂端是window對(duì)象,當(dāng)withTest被執(zhí)行的時(shí)候,js引擎生成了一個(gè)call object(調(diào)用對(duì)象)并將其添加到作用域鏈尾部上(window對(duì)象之后),語(yǔ)句運(yùn)行到with(document)時(shí),將生成新的作用域(實(shí)質(zhì)上這個(gè)作用域和普通function的作用域一樣,只不過(guò)它在with子句執(zhí)行完,該作用域也隨之消失)并添加到作用域鏈的尾部,所以with之內(nèi)的變量查找,就會(huì)優(yōu)先從這條鏈的with(document)作用域上查找,然后從withTest的call object中查找,最后查找window。with內(nèi)的語(yǔ)句執(zhí)行完之后,作用域鏈恢復(fù)原狀(with(document)生成的作用域被移出作用域鏈)。
ps:with是不被推薦的,因?yàn)樾枰僮髯饔糜蜴湥ㄒ七M(jìn)、移出作用域),執(zhí)行效率低下。
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
Javascript獲取當(dāng)前時(shí)間函數(shù)和時(shí)間操作小結(jié)
這篇文章主要介紹了Javascript獲取當(dāng)前時(shí)間函數(shù)和時(shí)間操作小結(jié),本文根據(jù)項(xiàng)目實(shí)際需求總結(jié)而來(lái),需要的朋友可以參考下2014-10-10
layer.open提交子頁(yè)面的form和layedit文本編輯內(nèi)容的方法
今天小編就為大家分享一篇layer.open提交子頁(yè)面的form和layedit文本編輯內(nèi)容的方法,具有好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2019-09-09
基于Bootstrap實(shí)現(xiàn)城市三級(jí)聯(lián)動(dòng)
這篇文章主要為大家詳細(xì)介紹了基于BootStrap實(shí)現(xiàn)城市三級(jí)聯(lián)動(dòng),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-11-11
JS+CSS實(shí)現(xiàn)滑動(dòng)切換tab菜單效果
這篇文章主要介紹了JS+CSS實(shí)現(xiàn)滑動(dòng)切換tab菜單效果,涉及javascript鼠標(biāo)事件及頁(yè)面元素樣式的動(dòng)態(tài)切換效果實(shí)現(xiàn)技巧,需要的朋友可以參考下2015-08-08
iframe父子頁(yè)面實(shí)現(xiàn)共用滾動(dòng)條的常見(jiàn)方法
在開(kāi)發(fā)過(guò)程中,有時(shí)候需要用到iframe復(fù)用不同域名下的頁(yè)面內(nèi)容,為了提供連貫的用戶(hù)體驗(yàn),經(jīng)常需要在主頁(yè)面(父頁(yè)面)和iframe子頁(yè)面之間共享滾動(dòng)位置,本文將介紹其中較為常見(jiàn)的一種方法來(lái)實(shí)現(xiàn)iframe父子頁(yè)面共用滾動(dòng)條,需要的朋友可以參考下2024-05-05
JavaScript高級(jí)程序設(shè)計(jì) DOM學(xué)習(xí)筆記
DOM是針對(duì)XML和HTML文檔的一個(gè)API:即規(guī)定了實(shí)現(xiàn)文本節(jié)點(diǎn)操控的屬性、方法,具體實(shí)現(xiàn)由各自瀏覽器實(shí)現(xiàn)。2011-09-09
JS實(shí)現(xiàn)頁(yè)面加載完成之后自動(dòng)刷新一次問(wèn)題
這篇文章主要介紹了JS實(shí)現(xiàn)頁(yè)面加載完成之后自動(dòng)刷新一次問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2023-02-02

