javascript：執(zhí)行環(huán)境與作用域鏈以及函數(shù)執(zhí)行

_ivan 發(fā)布于2019-08-21 10:36 / 2914人閱讀

摘要：作用域鏈的末端始終都是全局執(zhí)行環(huán)境的變量對象。作用域鏈的用途，是保證對執(zhí)行環(huán)境有權(quán)訪問的所有變量和函數(shù)的有權(quán)訪問理解當調(diào)用時，函數(shù)被定義并作為局部變量綁定到了作用域鏈上因此函數(shù)無論在哪里調(diào)用這種綁定依然有效因此返回值為。

執(zhí)行環(huán)境定義

定義了變量或者函數(shù)有權(quán)訪問的其他數(shù)據(jù),每個執(zhí)行環(huán)境都有一個與之相關(guān)聯(lián)的變量對象,環(huán)境中定義的所有變量和函數(shù)都保存在這個對象中。我們編寫的代碼無法訪問這個對象,但解析器會在處理數(shù)據(jù)時在后臺使用它。
執(zhí)行環(huán)境的創(chuàng)建

全局執(zhí)行環(huán)境

在web瀏覽器中，全局執(zhí)行環(huán)境被認為是window對象,因此所有全局變量和函數(shù)都是作為window對象的屬性和方法創(chuàng)建的。代碼載入瀏覽器時，全局執(zhí)行環(huán)境被創(chuàng)建(當我們關(guān)閉網(wǎng)頁或者瀏覽器時全局執(zhí)行環(huán)境才被銷毀)。

局部執(zhí)行環(huán)境

每個函數(shù)都有自己的執(zhí)行環(huán)境，因此局部執(zhí)行環(huán)境為函數(shù)對象。當函數(shù)被調(diào)用時函數(shù)的局部環(huán)境被創(chuàng)建（函數(shù)內(nèi)的代碼執(zhí)行完畢后，該環(huán)境被銷毀，同時保存在其中的所有變量和函數(shù)定義也隨之被銷毀)。

這個執(zhí)行環(huán)境以及相關(guān)的變量對象是個抽象的概念，解釋如下

var a = 1;
function fn(num1,num2){
    var b = 2;
    function fnInner(){
        var c = 3;
        alert(a + b + c);
    }
    fnInner();//fnInner調(diào)用時局部執(zhí)行環(huán)境創(chuàng)建
}
fn(4,5);//fn調(diào)用時局部執(zhí)行環(huán)境創(chuàng)建

                                  圖一

作用域鏈

javascript函數(shù)的執(zhí)行用到了作用域鏈，這個作用域鏈是函數(shù)定義的時候創(chuàng)建的,當定義一個函數(shù)時，它實際保存一個作用域鏈。當調(diào)用這個函數(shù)時，它創(chuàng)建一個新的對象來存儲它的局部變量，并將這個對象添加至保存的作用域鏈。作用域鏈的前端始終都是當前執(zhí)行的代碼所在環(huán)境的變量對象。作用域鏈的末端始終都是全局執(zhí)行環(huán)境的變量對象。作用域鏈的用途，是保證對執(zhí)行環(huán)境有權(quán)訪問的所有變量和函數(shù)的有權(quán)訪問

var scope = "global scope";
function checkscope(){
    var scope = "local scope";
    function f(){return scope};
    return f;
}
checkscope()();//local scope

理解:當調(diào)用checkscope時，函數(shù)f被定義并作為局部變量綁定到了checkscope作用域鏈上,因此函數(shù)f無論在哪里調(diào)用,這種綁定依然有效,因此返回值為local scope。

var num1 = 1;
function Outer(){
    var num2 = 2;
    console.log(num1 + num2);//3
    function Inner(){
        //這里可以訪問num3,num2,num1
        var num3 = 3;
        console.log(num1 + num2 + num3);//6
        }
    //這里可以訪問num2,Inner(),num1但不能訪問num3
    Inner();
}
Outer();
console.log(num1);//1，執(zhí)行環(huán)境
//這里只能訪問num1

作用域鏈(向上搜索):內(nèi)部環(huán)境可以通過作用域鏈訪問所有的外部環(huán)境，但外部環(huán)境不能訪問內(nèi)部環(huán)境中的任何變量和函數(shù)。

 var name = "Byron";
    function fn(){
        var name = "Csper";
        console.log(name);//Casper
    }
    fn();

越往內(nèi)部的環(huán)境，變量權(quán)重越高。

注意：沒有帶var關(guān)鍵字直接聲明的變量屬于全局變量如直接聲明a = 1,此時的a為全局變量。

javscript引擎在進入作用域時，會對代碼分兩輪處理。第一輪，初始化變量。第二輪，執(zhí)行代碼

var a = 1;
function prison (a) {
    console.log(a);//1
    var a;
    console.log(a);//1
}
prison(1);

函數(shù)執(zhí)行

函數(shù)調(diào)用進入執(zhí)行環(huán)境時，首先處理arguments，初始化形參(默認值為undefined)，然后初始化函數(shù)內(nèi)的函數(shù)聲明，當代碼一步一步執(zhí)行時再初始化函數(shù)內(nèi)的變量聲明(進入環(huán)境未開始執(zhí)行代碼時，值為undefined)。所以函數(shù)內(nèi)的初始化順序為變量聲明，函數(shù)聲明，形參。可以從上圖圖一看出。下面我來舉個例子(整個全局環(huán)境也是函數(shù))。

alert(typeof fn);//function，函數(shù)聲明提前
alert(typeof fn0);//undefined,變量聲明提前但未賦值
function fn(){
//函數(shù)表達式
}
var fn0 = function(){
//函數(shù)定義式
}
alert(typeof fn0);//function，此時變量已被賦值