談一談js中的執(zhí)行環(huán)境及作用域
最近在面試時(shí)被問到了對作用域鏈的理解,感覺當(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)的變量對象,環(huán)境中定義的所有變量和函數(shù)都保存在這個(gè)對象中。
理解了執(zhí)行環(huán)境,現(xiàn)在就看看什么是作用域鏈吧。每個(gè)函數(shù)都有自己的執(zhí)行環(huán)境,當(dāng)代碼在執(zhí)行環(huán)境中執(zhí)行時(shí),就會創(chuàng)建變量對象的作用域鏈。作用域鏈保證了對執(zhí)行環(huán)境有權(quán)訪問所有變量和函數(shù)的有序訪問。作用域鏈的前端,始終都是當(dāng)前執(zhí)行的代碼所在的環(huán)境的變量對象,如果環(huán)境是一個(gè)函數(shù),那么它的變量對象就是該函數(shù)的活動對象。作用域鏈的下一個(gè)變量對象來自包含(外部)環(huán)境,再下一個(gè)變量對象來自下一個(gè)包含環(huán)境。這樣一直延續(xù)到全局執(zhí)行環(huán)境,記住,全局執(zhí)行環(huán)境的變量對象永遠(yuǎn)是作用域中的最后一個(gè)對象。
請看下面的例子:
var scope="global"; function foo(){ console.log(scope); } foo();
在這個(gè)例子中,函數(shù)foo()的作用域鏈包含了兩個(gè)對象,一個(gè)是它自身對象,另一個(gè)是全局環(huán)境中的變量對象。因?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沒有塊級作用域
為什么說js沒有塊級作用域呢?我們來看下面的代碼:
if(true){ var color = "blue"; } alert(color); //"blue"
咦,為什么color在if語句執(zhí)行完畢后被銷毀呢?哈哈,如果在C、C++或Java中,color確實(shí)會被銷毀,但在JavaScript中,if語句中的變量聲明會將變量添加到當(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án)外部的執(zhí)行環(huán)境中。
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助。
- js 函數(shù)的執(zhí)行環(huán)境和作用域鏈的深入解析
- 深入Javascript函數(shù)、遞歸與閉包(執(zhí)行環(huán)境、變量對象與作用域鏈)使用詳解
- 淺談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)文章
微信小程序地圖(map)組件點(diǎn)擊(tap)獲取經(jīng)緯度的方法
這篇文章主要介紹了微信小程序地圖(map)組件點(diǎn)擊(tap)獲取經(jīng)緯度的方法,小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過來看看吧2019-01-01如何使用js正則表達(dá)式驗(yàn)證文件夾名是否符合規(guī)范
眾所周知正則表達(dá)式非常強(qiáng)大,下面這篇文章主要給大家介紹了關(guān)于如何使用js正則表達(dá)式驗(yàn)證文件夾名是否符合規(guī)范的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2023-05-05如何創(chuàng)建一個(gè)JavaScript彈出DIV窗口層的效果
我將用最通俗的語言和最簡潔的代碼給大家演示如何創(chuàng)建一個(gè)JavaScript彈出DIV窗口層的效果2013-09-09js自己實(shí)現(xiàn)一個(gè)大文件切片上傳+斷點(diǎn)續(xù)傳的示例代碼
本文主要介紹了js自己實(shí)現(xiàn)一個(gè)大文件切片上傳+斷點(diǎn)續(xù)傳的示例代碼,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2022-06-06基于canvas實(shí)現(xiàn)的絢麗圓圈效果完整實(shí)例
這篇文章主要介紹了基于canvas實(shí)現(xiàn)的絢麗圓圈效果,以完整實(shí)例形式分析了JavaScript結(jié)合html5的canvas實(shí)現(xiàn)動態(tài)圖形的繪制技巧,需要的朋友可以參考下2016-01-01JavaScript原型繼承_動力節(jié)點(diǎn)Java學(xué)院整理
這篇文章主要為大家詳細(xì)介紹了JavaScript原型繼承的相關(guān)資料,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-06-06