JavaScript作用域鏈與閉包的理解

tianhang 發(fā)布于2019-08-28 18:13 / 1499人閱讀

摘要：作用域是最重要的概念之一，想要學(xué)好就需要理解作用域和作用域鏈的工作原理。腳本錯(cuò)誤腳本錯(cuò)誤由此可以引發(fā)作用域鏈的概念在中，函數(shù)也是對(duì)象，實(shí)際上，里一切都是對(duì)象。當(dāng)一個(gè)函數(shù)創(chuàng)建后，它的作用域鏈會(huì)被創(chuàng)建此函數(shù)的作用域中可訪問的數(shù)據(jù)對(duì)象填充。

作用域是JavaScript最重要的概念之一，想要學(xué)好JavaScript就需要理解JavaScript作用域和作用域

鏈的工作原理。

1. 全局作用域（Global Scope）

（1）最外層函數(shù)和在最外層函數(shù)外面定義的變量擁有全局作用域，例如：

var authorName="Jessica";
function doSomething(){
    var blogName="mengera88";
    function innerSay(){
        alert(blogName);
    }
    innerSay();
}
alert(authorName); //Jessica
alert(blogName); //腳本錯(cuò)誤
doSomething(); //mengera88
innerSay() //腳本錯(cuò)誤

（2）所有末定義直接賦值的變量自動(dòng)聲明為擁有全局作用域，例如：

function doSomething(){
    var authorName="Jessica";
    blogName="mengera88";
    alert(authorName);
}
doSomething(); //Jessica
alert(blogName); //mengera88
alert(authorName); //腳本錯(cuò)誤

　　變量blogName擁有全局作用域，而authorName在函數(shù)外部無(wú)法訪問到。

（3）所有window對(duì)象的屬性擁有全局作用域

　　一般情況下，window對(duì)象的內(nèi)置屬性都擁有全局作用域，例如window.name、window.location、window.top等等。

2.局部作用域

和全局作用域相反，局部作用域一般只在固定的代碼片段內(nèi)可訪問到，最常見的例如函數(shù)內(nèi)部，所有在一些地方也會(huì)看到有人把這種作用域稱為函數(shù)作用域，例如下列代碼中的blogName和函數(shù)innerSay都只擁有局部作用域。

 function doSomething(){
    var blogName="Jessica";
    function innerSay(){
        alert(blogName);
    }
    innerSay();
 }
 alert(blogName); //腳本錯(cuò)誤
 innerSay(); //腳本錯(cuò)誤

由此可以引發(fā)作用域鏈的概念：

在JavaScript中，函數(shù)也是對(duì)象，實(shí)際上，JavaScript里一切都是對(duì)象。函數(shù)對(duì)象和其它對(duì)象一樣，擁有可以通過代碼訪問的屬性和一系列僅供JavaScript引擎訪問的內(nèi)部屬性。其中一個(gè)內(nèi)部屬性是[[Scope]]，由ECMA-262標(biāo)準(zhǔn)第三版定義，該內(nèi)部屬性包含了函數(shù)被創(chuàng)建的作用域中對(duì)象的集合，這個(gè)集合被稱為函數(shù)的作用域鏈，它決定了哪些數(shù)據(jù)能被函數(shù)訪問。

　　當(dāng)一個(gè)函數(shù)創(chuàng)建后，它的作用域鏈會(huì)被創(chuàng)建此函數(shù)的作用域中可訪問的數(shù)據(jù)對(duì)象填充。例如定義下面這樣一個(gè)函數(shù)：

function add(num1,num2) {
    var sum = num1 + num2;
    return sum;
}

在函數(shù)add創(chuàng)建時(shí)，它的作用域鏈中會(huì)填入一個(gè)全局對(duì)象，該全局對(duì)象包含了所有全局變量，函數(shù)add的作用域?qū)?huì)在執(zhí)行時(shí)用到。例如執(zhí)行如下代碼：

 var total = add(5,10);

執(zhí)行此函數(shù)時(shí)會(huì)創(chuàng)建一個(gè)稱為“運(yùn)行期上下文(execution context)”的內(nèi)部對(duì)象，運(yùn)行期上下文定義了函數(shù)執(zhí)行時(shí)的環(huán)境。每個(gè)運(yùn)行期上下文都有自己的作用域鏈，用于標(biāo)識(shí)符解析，當(dāng)運(yùn)行期上下文被創(chuàng) 建時(shí)，而它的作用域鏈初始化為當(dāng)前運(yùn)行函數(shù)的[[Scope]]所包含的對(duì)象。

這些值按照它們出現(xiàn)在函數(shù)中的順序被復(fù)制到運(yùn)行期上下文的作用域鏈中。它們共同組成了一個(gè)新的對(duì)象，叫“活動(dòng)對(duì)象(activation object)”，該對(duì)象包含了函數(shù)的所有局部變量、命名參數(shù)、參數(shù)集合以及this，然后此對(duì)象會(huì)被推入作用域鏈的前端，當(dāng)運(yùn)行期上下文被銷毀，活動(dòng)對(duì)象也隨之銷毀。

在函數(shù)執(zhí)行過程中，每遇到一個(gè)變量，都會(huì)經(jīng)歷一次標(biāo)識(shí)符解析過程以決定從哪里獲取和存儲(chǔ)數(shù)據(jù)。該過程從作用域鏈頭部，也就是從活動(dòng)對(duì)象開始搜索，查找同名的標(biāo)識(shí)符，如果找到了就使用這個(gè)標(biāo)識(shí)符對(duì)應(yīng)的變量，如果沒找到繼續(xù)搜索作用域鏈中的下一個(gè)對(duì)象，如果搜索完所有對(duì)象都未找到，則認(rèn)為該標(biāo)識(shí)符未定義。函數(shù)執(zhí)行過程中，每個(gè)標(biāo)識(shí)符都要經(jīng)歷這樣的搜索過程。