瀏覽器執行javaScript程式碼基礎

JavaScript 程式碼執行分為兩個階段：

編譯階段和執行階段

相關概念

• 編譯結果：輸入一段程式碼，經過編譯後，會生成兩部分內容：執行上下文（Execution context）和可執行程式碼
• 基礎變數儲存在棧（執行上下文）中，物件、陣列、函式儲存到堆 (HEAP）中，在棧空間中只是保留了物件的引用地址，當 JavaScript 需要訪問該資料的時候，是通過棧中的引用地址來訪問的
• 執行上下文：JavaScript 執行一段程式碼時的執行環境，比如呼叫一個函式，就會進入這個函式的執行上下文，確定該函式在執行期間用到的諸如 this、變數、物件以及函式等
• 呼叫棧：會存在多個執行上下文，在執行上下文建立好後，JavaScript 引擎會將執行上下文壓入棧中
• 棧溢位：呼叫棧是有大小的，當入棧的執行上下文超過一定數目，JavaScript 引擎就會報錯
• 編譯階段會存在變數提升
• 作用域：作用域是指在程式中定義變數的區域，該位置決定了變數的生命週期。在 ES6 之前，ES 的作用域只有兩種：全域性作用域和函式作用域。全域性作用域中的物件在程式碼中的任何地方都能訪問，其生命週期伴隨著頁面的生命週期。函式作用域就是在函式內部定義的變數或者函式，並且定義的變數或者函式只能在函式內部被訪問。函式執行結束之後，函式內部定義的變數會被銷燬。ES6之後，存在塊級作用域，就是使用一對大括號包裹的一段程式碼，比如函式、判斷語句、迴圈語句，甚至單獨的一個{}都可以被看作是一個塊級作用域。
• 閉包：當通過呼叫一個外部函式返回一個內部函式後，即使該外部函式已經執行結束了，但是內部函式引用外部函式的變數依然儲存在記憶體中，我們就把這些變數的集合稱為閉包。
• this: 在物件內部的方法中使用物件內部的屬性是一個非常普遍的需求。但是 JavaScript 的作用域機制並不支援這一點，基於這個需求，JavaScript 又搞出來另外一套 this 機制。ES6 中的箭頭函式並不會建立其自身的執行上下文，所以箭頭函式中的 this 取決於它的外部函式。普通函式中的 this 預設指向全域性物件 window。