摘要：不包括作為其嵌套函數的被解析的源代碼。作用域鏈當代碼在一個環境中執行時，會創建變量對象的一個作用域鏈。棧結構最頂層的執行環境稱為當前運行的執行環境，最底層是全局執行環境。無限制函數上下文。或者拋出異常退出一個執行環境。

前言

其實規范這東西不是給人看的，它更多的是給語言實現者提供參考。但是當碰到問題找不到答案時，規范往往能提供想要的答案 。偶爾讀一下能夠帶來很大的啟發和思考，如果只讀一章 Javascript 規范，大神們覺得非第10章莫屬。

我們來試試看，這次選用的是 ECMA2.2的 5.1 版，整個規范才200頁， 而第10章共10頁，可以感受到 Javascript 的精簡，目前的版本加了太多 ES6 的東西，讓人望而生畏。

資料地址：http://www.ecma-international...

任務

閱讀 ECMA262 5.1 第10章 Executable Code and Execution Contexts (可執行代碼與執行上下文)
你能針對這章內容提出問題嗎？ 即知道答案找出問題。
你能使用圖來更形象地表達文章內容嗎？

開始我們的探險之旅

原汁原味 ECMAScript 5.1 英文版
平易近人 ECMAScript 5.1 中文版

可執行代碼類型

像 v8 等 JavaScript 引擎都是按照 ecma-262 的規范來實現的，JavaScript 引擎在解釋 JavaScript 代碼時，將可執行代碼分為了三種。分別是：

全局代碼

代碼加載時首先進入的環境。
例如加載外部的 JavaScript 文件或者本地  標簽內的代碼。
但不包括任何 function 體內的代碼。

函數代碼

是指作為 function 被解析的源代碼。
不包括作為其嵌套函數的 function 被解析的源代碼。
因為 JavaScript 函數中還可以嵌套函數，因此這也是三種可執行代碼中最復雜的一種。

eval代碼

指的是傳遞給 eval 內置函數的代碼。

注：不了解 eval（string） 的小伙伴，請參考 eval() - JavaScript | MDN

當 JavaScript 引擎開始執行（進入）一段可執行代碼之后，會生成一個執行環境（Execution Context)，或執行上下文。引擎用執行環境來維護執行當前代碼所需要的變量聲明、this指向等。

詞法環境 (Lexical Environments)

詞法環境 是執行環境的三個組成的狀態之一。

官方解釋：詞法環境是用來定義特定變量和函數標識符的。一個詞法環境由一個環境記錄項和可能為空的外部詞法環境引用構成。

通常詞法環境會與 ECMAScript 代碼諸如 函數聲明（FunctionDeclaration）、WithStatement 或者 TryStatement 的 Catch 塊這樣的特定句法結構相聯系，且類似代碼每次執行都會有一個新的詞法環境被創建出來。
外部詞法環境引用 用于表示詞法環境的邏輯嵌套關系模型。（內部）詞法環境的外部引用是邏輯上包含內部詞法環境的詞法環境。外部詞法環境自然也可能有多個內部詞法環境。
例如，如果一個 FunctionDeclaration 包含兩個嵌套的 FunctionDeclaration，那么每個內嵌函數的詞法環境都是外部函數本次執行所產生的詞法環境。

環境記錄項 又可以分為兩種聲明式環境記錄項和對象式環境記錄項。

聲明式環境記錄項 用于標識標識符和函數聲明、變量聲明、catch 語句等語法元素的綁定。對象式環境記錄項 主要用于定義那些將標識符與具體對象的屬性綁定的語法元素。

咬文嚼字，不好理解？

通俗點講： 詞法環境就是 JavaScript 引擎在執行代碼過程中用來標識函數聲明、變量聲明這一類的。我們每次聲明一個函數，或者使用 with 、catch語句的時候，就會有新的詞法環境被創建出來。全局詞法環境的外部詞法環境就是空的，因為他已經是最外層的詞法環境了。

我們用個例子來說明詞法環境：

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);

詞法環境的運算

給出一個標識符字符串，首先在當前的詞法環境內尋找，如果存在，返回引用的標識符字符串，如果不存在，再在當前詞法環境的外部詞法環境尋找。

咦，怎么感覺和作用域鏈的概念很相似？他們有什么關系嗎？

執行環境 當執行流進入一個函數時，函數的環境會被推入一個環境棧中。當函數執行之后，環境棧將其彈出，把控制權返回給之前的執行環境。

作用域鏈 當代碼在一個環境中執行時，會創建變量對象的一個作用域鏈。其用途是保證對執行環境有權訪問的所有變量和函數的有序訪問。一個包含環境的變量對象到另一個包含環境的變量對象，最后到全局執行環境的變量對象。

函數只要被創建，就會有自己的“地盤”，有自己的作用域。但是只有函數被執行的時候，才會有自己的執行環境。函數執行完畢的時候，執行環境就會退出。而且一個作用域下可能存在多個執行環境，比如閉包。

小總結

1、詞法環境分為了兩部分：環境記錄項和外部詞法環境。
2、環境記錄項根據綁定的 ECMA 腳本元素的不同也分為了兩部分。
3、函數聲明或者使用 with 、catch語句時，就會有新的詞法環境被創建出來。

執行環境（Execution Contexts）

如果我們的 JavaScript 程序有各種函數，函數之間還有嵌套的情況，那 JavaScript 引擎怎么解釋各種聲明和執行上下文哪？

當控制器轉入 ECMA 腳本的可執行代碼時，上文已經說了有三種可執行代碼，不管進入哪一種控制器都會進入一個執行環境。多個執行環境在邏輯上形成一個棧結構。棧結構最頂層的執行環境稱為當前運行的執行環境，最底層是全局執行環境。

用一張圖解釋

因為 JS 引擎被實現為單線程，也就是同一時間只能發生一件事情，其他的行為就會依次排隊。

你可以有任意多個函數執行環境，每次調用函數創建一個新的執行環境，會創建一個私有作用域，函數內部聲明的任何變量都不能在當前函數作用域外部直接訪問。函數能訪問當前執行環境外面的變量聲明，但在外部執行環境不能訪問內部的變量/函數聲明。

小總結

關于執行棧（調用棧）

單線程。
同步執行。
一個全局上下文。
無限制函數上下文。
每次函數被調用創建新的執行上下文，包括調用自己。
return 或者拋出異常退出一個執行環境。

我們用一個具體的函數理解：

function foo(i) {
  if (i < 0) return;
  console.log("begin:" + i);
  foo(i - 1);
  console.log("end:" + i);
}
foo(2);

// 輸出:

// begin:2
// begin:1
// begin:0
// end:0
// end:1
// end:2

代碼的執行流程進入內部函數，創建一個新的執行上下文并把它壓入執行棧的頂部。瀏覽器總會執行位于棧頂的執行上下文，一旦當前上下文函數執行結束，它將被從棧頂彈出，并將上下文控制權交給當前的棧。 這樣，堆棧中的上下文就會被依次執行并且彈出堆棧，直到回到全局的上下文。

執行環境包含所有用于追蹤與其相關的代碼的執行進度的狀態。精確地說，每個執行環境包含如下表列出的組件。

執行環境的三個狀態

組件	作用目的
詞法環境	指定一個詞法環境對象，用于解析該執行環境內的代碼創建的標識符引用。
變量環境	指定一個詞法環境對象，其環境數據用于保存由該執行環境內的代碼通過 變量表達式 和 函數表達式 創建的綁定。
this 綁定	指定該執行環境內的 ECMA 腳本代碼中 this 關鍵字所關聯的值。

當創建一個執行環境時，其詞法環境組件和變量環境組件最初是同一個值。在該執行環境相關聯的代碼的執行過程中，變量環境組件永遠不變，而詞法環境組件有可能改變。變量環境的不變和詞法環境的可能改變都是指引用的改變。

建立執行環境

解釋執行全局代碼或使用 eval 函數輸入的代碼會創建并進入一個新的執行環境。每次調用 ECMA 腳本代碼定義的函數也會建立并進入一個新的執行環境，即便函數是自身遞歸調用的。
每一次 return 都會退出一個執行環境。拋出異常也可退出一個或多個執行環境。
當控制流進入一個執行環境時，會設置該執行環境的 this 綁定組件，定義變量環境和初始詞法環境，并執行聲明式綁定初始化過程。以上這些步驟的嚴格執行方式由進入的代碼的類型決定。

進入全局代碼

執行以下步驟：

1、將變量環境設置為 全局環境 。 
2、將詞法環境設置為 全局環境 。
3、將 this 綁定設置為 全局對象 。
4、使用全局代碼執行聲明式綁定初始化化步驟。

進入函數代碼

當控制流根據一個函數對象 F、調用者提供的 thisArg 以及調用者提供的 argumentList，進入函數代碼的執行環境時，執行以下步驟

如果函數代碼是嚴格模式下的代碼，設 this 綁定 為 thisArg。
否則如果 thisArg 是 null 或 undefined，則設 this 綁定 為全局對象。
否則如果 Type(thisArg) 的結果不為 Object，則設 this 綁定 為 ToObject(thisArg)。
否則設 this 綁定 為 thisArg。
以 F 的 [[Scope]] 內部屬性為參數調用 NewDeclarativeEnvironment(新建聲明式詞法環境)，并令 localEnv 為調用的結果。
設 詞法環境組件 為 localEnv。
設 變量環境組件 為 localEnv。
令 code 為 F 的 [[Code]] 內部屬性的值。
使用函數代碼 code 和 argumentList 執行聲明式綁定初始化化步驟。

我們用偽代碼表示一下：

if(是 嚴格模式) {
    this = thisArg
} else if(thisArg === null || thisArg === undefined) {
    this = window
} else if(typeof thisArg != "object") {
    this = Object(thisArg)
} else {
    this = thisArg
}

哎，這里的 thisArg 指的是什么？上文說了 thisArg 來自于函數的調用者。

這里代表函數的 apply，call，bind 等設置 this 綁定的參數：

通過 call 或者 apply 調用函數時，thisArg 的值比較明顯，為傳入的第一個參數。

Function.prototype.apply (thisArg, argArray)

Function.prototype.call (thisArg [ , arg1 [ , arg2, … ] ] )

當然 thisArg 還有其他的可能，具體的可以參考這篇文章 Javascript this 解析

對上面的偽代碼做一下解釋：

嚴格模式: 也就是說，在嚴格模式下，this 只能為 thisArg，而當 thisArg 為 undefined 時，this 就是 undefined ，而不是 window。

非嚴格模式: 如果 thisArg 是 null (如 fun.call(null)) 或 undefined （直接調用函數），則 this 為全局對象，瀏覽器里就是 window。

否則，如果 傳入了 thisArg, 但不是個對象，則把它轉為對象，并賦給 this，比如，當 fun.call("hhh") 時，打印 fun 內的 this 為

String {0: "h", 1: "h", 2: "h", length: 3, [[PrimitiveValue]]: "hhh"}

否則 ，也就是僅剩的一種情況，顯式的傳入了一個對象作為 thisArg 參數的情況下，設 this 綁定為 thisArg。

聲明式綁定初始化

每個執行環境都有一個關聯的 變量環境。當在一個執行環境下評估一段 ECMA 腳本時，變量和函數定義會以綁定的形式添加到這個 變量環境 的環境記錄中。對于函數代碼，參數也同樣會以綁定的形式添加到這個 變量環境 的環境記錄中。

總結

ECMAScript 代碼的執行由運行環境來完成。不同的運行環境可能采取不同的執行方式，但基本的流程是相同的。如瀏覽器在解析 HTML 頁面中遇到