JavaScript中的呼叫堆疊(Call Stack)是甚麼？

首先，我們要知道JavaScript是個單執行緒或稱為單線程(single thread runtime)的程式語言，意指一次只能執行一個任務，而等待執行的任務會被放入堆疊中等待被執行，而這裡的堆疊我們稱為Call Stack。

呼叫堆疊（Call Stack）

呼叫堆疊顧名思義，他的資料結構是個堆疊(Stack)，這種資料結構具有後進先出(LIFO, Last in First out)的處理性質。而在每一次呼叫函式時，會把這個函式添加到堆疊的最上方，待執行完後才將函式從上方抽離。

當我們執行下面程式碼時：

Call Stack看起來會像這樣：

執行這段程式碼發生了甚麼事？

首先進入 stack 的會是這個檔案中全域環境的程式(main)；

接著func1會被呼叫，放入stack的最上方；

在func1又會呼叫func2，然後func2會放入stack的最上方；

執行 console.log("func2") 完後，func2()函式會從 stack 中移除；

接著執行 console.log("func1")，func1() 函式會從 stack 中移除。

整段程式碼都執行完畢時，便把 main 也拋出 stack。

以上就是呼叫堆疊Call Stack的執行過程，這也可以解釋了為何JavaScript會是個單執行緒程式語言的原因。

而以上的例子是個同步(synchronous)的情況，若是發生非同步(asynchronous)的情況，例如像是setTimeout、promise…等等，就需要用到任務循環(Event Loop) 與任務隊列( Job Queue) 的概念了。下回待續~