談一談js中的執(zhí)行環(huán)境及作用域
最近在面試時(shí)被問到了對(duì)作用域鏈的理解,感覺當(dāng)時(shí)回答的不是很好,今天就來說說js中的作用域鏈吧。
首先來說說js中的執(zhí)行環(huán)境,所謂執(zhí)行環(huán)境(有時(shí)也稱環(huán)境)它是JavaScript中最為重要的一個(gè)概念。執(zhí)行環(huán)境定義了變量或函數(shù)有權(quán)訪問的其他數(shù)據(jù) ,決定了它們各自的行為。而每個(gè)執(zhí)行環(huán)境都有一個(gè)與之相關(guān)的變量對(duì)象,環(huán)境中定義的所有變量和函數(shù)都保存在這個(gè)對(duì)象中。
理解了執(zhí)行環(huán)境,現(xiàn)在就看看什么是作用域鏈吧。每個(gè)函數(shù)都有自己的執(zhí)行環(huán)境,當(dāng)代碼在執(zhí)行環(huán)境中執(zhí)行時(shí),就會(huì)創(chuàng)建變量對(duì)象的作用域鏈。作用域鏈保證了對(duì)執(zhí)行環(huán)境有權(quán)訪問所有變量和函數(shù)的有序訪問。作用域鏈的前端,始終都是當(dāng)前執(zhí)行的代碼所在的環(huán)境的變量對(duì)象,如果環(huán)境是一個(gè)函數(shù),那么它的變量對(duì)象就是該函數(shù)的活動(dòng)對(duì)象。作用域鏈的下一個(gè)變量對(duì)象來自包含(外部)環(huán)境,再下一個(gè)變量對(duì)象來自下一個(gè)包含環(huán)境。這樣一直延續(xù)到全局執(zhí)行環(huán)境,記住,全局執(zhí)行環(huán)境的變量對(duì)象永遠(yuǎn)是作用域中的最后一個(gè)對(duì)象。
請(qǐng)看下面的例子:
var scope="global";
function foo(){
console.log(scope);
}
foo();
在這個(gè)例子中,函數(shù)foo()的作用域鏈包含了兩個(gè)對(duì)象,一個(gè)是它自身對(duì)象,另一個(gè)是全局環(huán)境中的變量對(duì)象。因?yàn)槲覀兛梢栽谶@個(gè)作用域鏈中找的scope,所以可以在函數(shù)內(nèi)部里訪問到它。
在看一個(gè)例子:
var color = "blue";
function changeColor(){
var anoterColor = "red";
function swapColor(){
var tempColor = anoterColor;
anoterColor = color;
color = tempColor;
console.log(color);
}
swapColor();
}
changeColor();
在這個(gè)例子中,有三個(gè)執(zhí)行環(huán)境:全局環(huán)境、changeColor()的局部環(huán)境和swapColor()局部環(huán)境。我們來看看這個(gè)例子的作用域鏈?zhǔn)窃鯓拥陌伞?/p>

圖中的矩形表示特定的執(zhí)行環(huán)境。我們可以看到變量tempColor只能在swapColor()環(huán)境中訪問到,而在changeColor()的局部環(huán)境還是全局環(huán)境中都無法訪問到它。因此我們可以得到一個(gè)結(jié)論:內(nèi)部的環(huán)境可以通過作用域鏈訪問所有的外部環(huán)境,但外部的環(huán)境無法訪問內(nèi)部的環(huán)境中的任何變量和函數(shù)。每個(gè)環(huán)境都可以向上搜索作用域鏈,以查詢變量和函數(shù)名;但是任何環(huán)境都不能通過向下搜索作用域而進(jìn)入另一個(gè)執(zhí)行環(huán)境。
作用域中我還想說說的是:js沒有塊級(jí)作用域
為什么說js沒有塊級(jí)作用域呢?我們來看下面的代碼:
if(true){
var color = "blue";
}
alert(color); //"blue"
咦,為什么color在if語句執(zhí)行完畢后被銷毀呢?哈哈,如果在C、C++或Java中,color確實(shí)會(huì)被銷毀,但在JavaScript中,if語句中的變量聲明會(huì)將變量添加到當(dāng)前的執(zhí)行環(huán)境中(在這里是全局環(huán)境)中。特別地,在for語句時(shí)要牢記這一差異,例如:
for(var i = 0;i< 10; i++){
doSomething(i);
}
alert(i); //10
記?。?/strong>在JavaScript中,由for語句創(chuàng)建的變量i即使在for循環(huán)執(zhí)行結(jié)束之后,也依然會(huì)存在于循環(huán)外部的執(zhí)行環(huán)境中。
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助。
- js 函數(shù)的執(zhí)行環(huán)境和作用域鏈的深入解析
- 深入Javascript函數(shù)、遞歸與閉包(執(zhí)行環(huán)境、變量對(duì)象與作用域鏈)使用詳解
- 淺談javascript中執(zhí)行環(huán)境(作用域)與作用域鏈
- javascript作用域鏈與執(zhí)行環(huán)境詳解
- javascript基礎(chǔ)進(jìn)階_深入剖析執(zhí)行環(huán)境及作用域鏈
- javascript中關(guān)于執(zhí)行環(huán)境的雜談
- javascript執(zhí)行環(huán)境及作用域詳解
- 淺談JavaScript 執(zhí)行環(huán)境、作用域及垃圾回收
- 老生常談原生JS執(zhí)行環(huán)境與作用域
- JavaScript執(zhí)行環(huán)境及作用域鏈實(shí)例分析
相關(guān)文章
js實(shí)現(xiàn)簡(jiǎn)單的日歷顯示效果函數(shù)示例
這篇文章主要介紹了js實(shí)現(xiàn)簡(jiǎn)單的日歷顯示效果函數(shù),結(jié)合完整實(shí)例形式分析了JavaScript實(shí)現(xiàn)的日歷功能相關(guān)原理與具體操作技巧,需要的朋友可以參考下2019-11-11
讓innerText在firefox火狐和IE瀏覽器都能用的寫法
下面的代碼主要是用來解決firefox瀏覽器不支持innerText的問題,需要的朋友可以參考下。2011-05-05
javascript 像素拼圖實(shí)現(xiàn)代碼
非常不錯(cuò)的像素拼圖效果2009-04-04

