圖解JS詞法環境(Lexical environment)

在ES5中使用lexical environment來管理靜態作用域,而不再是ES3中的AO/VO

詞法環境就是描述環境的對象,主要包含兩個部分:

  • 環境記錄(Environment Record)
    記錄相應環境中的形參,函數聲明,變量聲明等
  • 對外部環境的引用(out reference)

代碼示例 :

var x = 10;
function foo(y){
    var z = 30;
    function bar(q){
        return x + y + z + q;
    }
    return bar;
}
var bar = foo(20);
bar(40);

環境初始化 : 在執行函數/全局代碼之前進行環境初始化

設置outer reference
先確定當前環境的外部引用(函數環境與該函數的scope屬性有關)

環境記錄初始化:就是我們常遇到的聲明提前
在執行全局代碼或者函數代碼之前,先掃描相應環境中的形參,函數聲明,變量聲明並將其記錄在環境記錄中(Environment Record)

全局代碼執行前,先初始化全局環境

函數代碼執行前,先初始化函數環境

圖解上述代碼中foo()函數的環境記錄初始化 :

var bar = foo(20);
//foo()函數在執行之前會進行foo環境的環境初始化
//先設置foo環境的外部引用(通過foo()函數的scope屬性)
//將形參y:20,z:undefined記錄在環境記錄中
//在初始化環境記錄遇到函數聲明時會創建一個內部函數對象,這個函數對象有一個scope屬性指向函數聲明所在的環境,如在該代碼示例中,掃描到bar()函數聲明時會在foo environment中創建一個內部函數對象,其scope屬性指向bar()函數聲明所在的foo environment,重要的一點是:當開始執行bar()函數前初始化bar()函數的環境時,就把bar()函數的scope屬性指向的foo environment 賦值給bar環境的out reference作爲其外部引用.

如圖所以:
在這裏插入圖片描述
環境初始化完成之後,就開始執行環境中的代碼

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章