執行環境(Execution Context)


常見的程式語言多由另一個更底層的程式語言所寫成,如 Python、C++、PHP 等皆由 C 語言寫成,但 JavaScript 並非由任何程式語言寫成,而是由歐洲電腦製造商協會(ECMA)制定的標準,這些標準會持續更新,最有名的一次為 2015 年版的 ECMA2015 (又稱ES6,表示「ECMA Script 6」),現今的 JavaScript 多遵照 ES6 以後的版本規則寫成。

歐洲電腦製造商協會標誌(取自維基百科

每個瀏覽器都有自己的 JavaScript 引擎,用來理解並處理 JavaScript 的程式碼,如 Mozilla Firefox 的 SpiderMonkey、Google Chrome 的 V8、Microsoft Edge 的 Chakra 等。

要理解 JavaScript 是如何運行的,可以先從認識「執行環境」開始:

執行環境(Execution Context)

指程式碼讀取、執行的位置,只要是不屬於任何函式中的程式碼,皆位於「全域執行環境」,反之則位於「函式執行環境」。

不論是「全域執行環境」或「函式執行環境」,都可以分為「創建階段」與「執行階段」;「創建階段」表示執行環境運行一系列前置準備工作,以便後續執行程式碼,「執行階段」則為一行一行讀取並執行程式碼的過程。

全域執行環境(Global Execution Context)

指「整個程式碼」執行前預設的環境,兩階段分別會進行下列事項:

創建階段(Creation Phase)

  • 建立「全域物件(global object)」,對於瀏覽器來說,就是「視窗物件(window object)」。
  • 建立「this」關鍵字,若全域執行環境為瀏覽器,則「this」指向瀏覽器的「window object」。
  • 根據「閉包(closure)」建立「範圍鏈(scope chain)」。
  • 為函式宣告(function declaration)與 var 變數預留記憶體空間,即「提升(hoisting)」。

執行階段(Execution Phase)

  1. 以「調用棧(call stack)」方式一行一行跑程式碼。

函式執行環境(Function Execution Context)

創建階段(Creation Phase)

  1. 根據「閉包(closure)」建立「範圍鏈(scope chain)」。
  2. 建立「this」關鍵字指向一個內部物件;但若為箭頭函式(arrow function),則「this」指向「window object」。
  3. 為函式宣告(function declaration)與 var 變數預留記憶體空間,即「提升(hoisting)」。
    #### 執行階段(Execution Phase)
  4. 以「調用棧(call stack)」方式一行一行跑程式碼。
#javascript #執行環境







你可能感興趣的文章

Command Line 超新手入門

Command Line 超新手入門

CSS - Grid: cells, areas, and nesting grid

CSS - Grid: cells, areas, and nesting grid

開始紀錄

開始紀錄






留言討論