JavaScript執(zhí)行環(huán)境及作用域鏈實(shí)例分析
本文實(shí)例講述了JavaScript執(zhí)行環(huán)境及作用域鏈。分享給大家供大家參考,具體如下:
1、執(zhí)行環(huán)境:
每個(gè)執(zhí)行環(huán)境都有一個(gè)與之關(guān)聯(lián)的變量對(duì)象,環(huán)境中定義的所有變量和函數(shù)都保存在這個(gè)對(duì)象中。
執(zhí)行環(huán)境包括全局執(zhí)行環(huán)境和函數(shù)執(zhí)行環(huán)境。
全局執(zhí)行環(huán)境是最外圍的一個(gè)執(zhí)行環(huán)境,在瀏覽器中,全局執(zhí)行環(huán)境被認(rèn)為是是window對(duì)象,所有全局變量和屬性都是作為window對(duì)象的屬性和方法創(chuàng)建的。
函數(shù)執(zhí)行環(huán)境是指函數(shù)的執(zhí)行環(huán)境,當(dāng)執(zhí)行流進(jìn)入一個(gè)函數(shù)時(shí),函數(shù)的環(huán)境會(huì)被推入一個(gè)環(huán)境棧中,在函數(shù)執(zhí)行之后,棧將其環(huán)境彈出,將控制權(quán)返回到之前的執(zhí)行環(huán)境。
2、作用域鏈:
當(dāng)代碼在一個(gè)環(huán)境中執(zhí)行時(shí),會(huì)創(chuàng)建變量對(duì)象的一個(gè)作用域鏈。
作用域鏈的用途:保證對(duì)執(zhí)行環(huán)境有權(quán)訪(fǎng)問(wèn)的所有變量和函數(shù)的有序訪(fǎng)問(wèn)。
作用域鏈的前端,始終是當(dāng)前執(zhí)行的代碼所在環(huán)境的變量對(duì)象,若此環(huán)境是函數(shù),則將其活動(dòng)對(duì)象作為變量對(duì)象?;顒?dòng)對(duì)象最開(kāi)始時(shí)只包含一個(gè)變量,即arguments對(duì)象(該對(duì)象在全局環(huán)境中是不存在的),作用域鏈的下一個(gè)對(duì)象來(lái)自包含環(huán)境,再下一個(gè)變量則來(lái)自下一個(gè)包含環(huán)境,這樣一直延續(xù)到全局執(zhí)行環(huán)境。全局執(zhí)行環(huán)境的變量對(duì)象始終是作用域鏈的最后一個(gè)對(duì)象。
每個(gè)環(huán)境都可以向上搜索作用域鏈,以查詢(xún)變量和函數(shù)名,終點(diǎn)就是搜索到全局執(zhí)行環(huán)境,但是任何環(huán)境不能通過(guò)向下搜索作用域鏈而進(jìn)入另一個(gè)執(zhí)行環(huán)境。內(nèi)部環(huán)境可以通過(guò)作用域鏈訪(fǎng)問(wèn)所有的外部環(huán)境,但外部環(huán)境不能訪(fǎng)問(wèn)內(nèi)部環(huán)境的任何變量和函數(shù)。
3、延長(zhǎng)作用域鏈:
雖然執(zhí)行環(huán)境只有兩種:全局執(zhí)行環(huán)境和函數(shù)執(zhí)行環(huán)境,但是可以有方法延長(zhǎng)作用域鏈,因?yàn)橛行┱Z(yǔ)句可以在作用域鏈的前端臨時(shí)增加一個(gè)變量對(duì)象,該變量對(duì)象會(huì)在代碼執(zhí)行后被移除。
當(dāng)執(zhí)行流進(jìn)入下列語(yǔ)句時(shí),作用域鏈會(huì)延長(zhǎng):
(1)try-catch語(yǔ)句的catch塊:catch語(yǔ)句會(huì)創(chuàng)建一個(gè)新的變量對(duì)象,其中包含的是被拋出的錯(cuò)誤對(duì)象的聲明,該變量對(duì)象只在catch塊內(nèi)部有效,在catch塊外部無(wú)法訪(fǎng)問(wèn)到。
(2)with語(yǔ)句:with
語(yǔ)句會(huì)將指定的對(duì)象添加到作用域鏈中。
eg1:
function setUrl(){ var parameter="?name=Alice"; var url = href + parameter; return url; } var result = setUrl(); alert(result);//報(bào)錯(cuò):href is no defined
eg2:
function setUrl(){ var parameter="?name=Alice"; with(location) { var url = href + parameter; } return url; } var result = setUrl(); alert(result);//http://localhost/text.html?name=Alice
with
語(yǔ)句接收的是location對(duì)象,因此其變量對(duì)象中包含了location對(duì)象的所有屬性和方法,location對(duì)象被添加到了作用域鏈的前端。
eg3:
var obj = {href : "http://www.baidu.com"}; var ; function setUrl(){ var parameter="?name=Alice"; with(obj) { ; var url = href + parameter; } return url; } var result = setUrl(); alert(result);//http://www.google.cn?name=Alice alert(href);//http://www.sina.cn
with
語(yǔ)句中并沒(méi)有更改變量href的值,而是更改了obj對(duì)象的 href
屬性。
也就是說(shuō),with
中首先查找的是相關(guān)對(duì)象的屬性,如果沒(méi)有,才改變變量的值。
eg4:
var obj = {}; var ; function setUrl(){ var parameter="?name=Alice"; with(obj) { ; var url = href + parameter; } return url; } var result = setUrl(); alert(result);//http://www.google.cn?name=Alice alert(href);//http://www.google.cn
去掉obj對(duì)象的 href
屬性后,才更改變量href
的值。
更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專(zhuān)題:《JavaScript常用函數(shù)技巧匯總》、《javascript面向?qū)ο笕腴T(mén)教程》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》及《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》
希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。
相關(guān)文章
JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)版簡(jiǎn)易計(jì)算器功能
這篇文章主要介紹了JavaScript實(shí)現(xiàn)網(wǎng)頁(yè)版簡(jiǎn)易計(jì)算器功能,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2022-07-07基于jquery實(shí)現(xiàn)全屏滾動(dòng)效果
相信大家都很喜歡網(wǎng)易郵箱、QQ瀏覽器的官方網(wǎng)站這樣的可全屏滾動(dòng)的效果,也許更多的朋友想把全屏滾動(dòng)效果做到自己的網(wǎng)站中,本文就帶著大家一起完成這個(gè)效果2015-11-11JavaScript bind函數(shù)手寫(xiě)教程
bind()方法主要就是將函數(shù)綁定到某個(gè)對(duì)象,bind()會(huì)創(chuàng)建一個(gè)函數(shù),函數(shù)體內(nèi)的this對(duì)象的值會(huì)被綁定到傳入bind()第一個(gè)參數(shù)的值,當(dāng)然這是綁定哦,不是像call、apply一樣直接執(zhí)行,apply要執(zhí)行的話(huà)還得自己調(diào)用2022-12-12ES6中的迭代器、Generator函數(shù)及Generator函數(shù)的異步操作方法
這篇文章主要介紹了ES6中的迭代器、Generator函數(shù)以及Generator函數(shù)的異步操作方法,非常不錯(cuò),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-05-05用js實(shí)現(xiàn)的自定義的對(duì)話(huà)框的實(shí)現(xiàn)代碼
javascript alert函數(shù)的替代方案,一個(gè)自定義的對(duì)話(huà)框的方法2010-03-03為什么JavaScript中0.1 + 0.2 != 0.3
這篇文章主要給大家介紹了關(guān)于為什么JavaScript中0.1 + 0.2 != 0.3的相關(guān)資料,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-12-12javascript將DOM節(jié)點(diǎn)添加到文檔的方法實(shí)例分析
這篇文章主要介紹了javascript將DOM節(jié)點(diǎn)添加到文檔的方法,對(duì)比分析了javascript的兩種節(jié)點(diǎn)創(chuàng)建的方法,涉及javascript節(jié)點(diǎn)操作及運(yùn)行時(shí)間計(jì)算的相關(guān)技巧,需要的朋友可以參考下2015-08-08layui前端框架之table表數(shù)據(jù)的刷新方法
今天小編就為大家分享一篇layui前端框架之table表數(shù)據(jù)的刷新方法,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-08-08