當我們在學習 JavaScript 時，很快就會發現它是一個「單工」語言，也就是說，JavaScript 一次只能做一件事情。然而，現實中的網頁應用程式往往需要同時處理多個任務，比如按鈕的點擊事件、Web API 的回調事件等。為了解決這個問題，JavaScript 採用了一個名為「任務排隊機制」的概念，其中最核心的部分就是 Event Loop。

JavaScript 的任務排隊機制

在 JavaScript 中，所有的任務都會被送到一個叫做 call stack（呼叫堆疊）的「任務罐子」中。這個罐子裡的任務會依序排隊等待被執行。每當你執行一段 JavaScript 代碼，比如點擊按鈕加入購物車、進入訂單頁面或發送下訂單的請求，這些操作都會被送到 call stack 中。

Event Loop 的運作原理

那麼，Event Loop 是如何確保這些任務能夠順利進行的呢？Event Loop 的工作就像一個不知疲倦的檢查員，它不斷地檢查 call stack，看看裡面的任務是否已經被清空（也就是執行完畢）。如果 call stack 裡還有任務，Event Loop 就會讓 JavaScript 引擎繼續處理這些任務。一旦 call stack 變空了，Event Loop 就會檢查是否有其他等待處理的任務，比如來自 Web API 的回調事件，並把這些新的任務加入到 call stack 中，繼續處理。

具體應用：Web 點餐系統

舉個例子來說明這個機制。如果我們有一個 Web 點餐系統，流程可能是這樣的：

使用者加入購物車：當你選擇一個餐點並加入購物車時，JavaScript 會立即執行這個事件，把餐點加入到購物車清單中，這個任務會被送到 call stack 中。

進入訂單頁面：接著，你點擊「結帳」按鈕，這會觸發一個事件來導向訂單頁面。這個動作也會被送到 call stack，等待處理。

下訂單：在訂單頁面上，你按下「下訂單」按鈕，這時 JavaScript 會發送一個請求（例如透過 fetch）到伺服器來確認你的訂單。這個請求可能需要一些時間才能完成，JavaScript 會繼續處理其他的任務，比如讓你在等待時仍能操作其他按鈕或輸入欄位。

伺服器回應：當伺服器處理完訂單並返回確認結果後，JavaScript 會收到回應，這時會更新頁面，顯示訂單成功的訊息或是錯誤提示。

在這個過程中，Event Loop 持續檢查 call stack，確保每個任務都能按順序被執行完畢，即使是在等待伺服器回應的過程中，JavaScript 也不會停下來，而是繼續處理其他任務，讓整個應用程式流暢運作。