Async / Await
關鍵字 · JavaScript
JavaScript (ES2017) 的現代語法，能以循序且可讀的方式撰寫非同步程式碼——將複雜的 Promise 鏈轉化為清晰的指令，簡化 API 呼叫、資料庫查詢及所有非阻塞操作的管理。
基於 Promises 的機制，引入兩個關鍵字：`async` 用於宣告自動回傳 Promise 的非同步函式，`await` 用於暫停執行直到該 Promise 解析完成——消除「回呼地獄」，使程式碼在大型專案中更具可維護性。
現代 Full-stack 開發中不可或缺的模式，無論是客戶端（React、Next.js）或伺服器端（Node.js、Express.js）皆廣泛使用——在網路呼叫或檔案讀取等 I/O 操作期間釋放主執行緒，確保最佳效能。
JavaScript 中的 Promise 是一個代表非同步操作未來結果的物件——無論成功或失敗。它有三種狀態：「pending」（等待中）、「fulfilled」（已成功解析）或「rejected」（已拒絕並帶有錯誤）。Promise 徹底革新了非同步管理方式，用優雅的 `.then()` 和 `.catch()` 鏈式呼叫取代了巢狀回呼。在 Async Code，我們將 Promise 作為所有 API 通訊與伺服器操作的基礎。
當您的程式碼執行耗時操作時就應使用 async 和 await：呼叫 REST API、查詢資料庫、讀取檔案或任何網路處理。當多個非同步操作需要循序串接或使用 `Promise.all()` 並行執行時，它們特別推薦使用。我們的團隊在 Next.js 和 Node.js 專案中系統性地應用 async/await，確保程式碼可讀、高效且易於整個團隊維護。
在 JavaScript 中建立非同步函式，只需在函式宣告前加上 `async` 關鍵字即可。例如：`async function fetchData() const response = await fetch('/api/data'); return response.json(); `。`async` 關鍵字會自動將回傳值轉換為 Promise，並允許在函式主體內使用 `await`。這是我們在所有應用程式中用來妥善管理後端通訊的標準語法。
Promise 是 JavaScript 原生物件，封裝了未來可能可用的值，作為非同步資料生產者與消費者之間的契約。它保證結果——無論成功或錯誤——都只會透過 `.then()`、`.catch()` 和 `.finally()` 方法處理一次。Promise 是 async/await、fetch API 以及整個 Node.js 和現代瀏覽器非同步生態系統的基礎構建模組。
非同步函式是使用 `async` 關鍵字宣告的函式，隱式回傳 Promise 並允許在其主體中使用 `await` 關鍵字。與以同步阻塞方式執行的傳統函式不同，它在等待耗時操作（網路呼叫、計時器、檔案讀取）期間會釋放主執行緒。這個機制對於維持網頁應用程式的回應性以及提供流暢且不阻塞介面的使用者體驗至關重要。
非同步函式是一種能在背景執行操作而不阻塞應用程式其餘部分的函式。在 JavaScript 中，它透過 `async` 關鍵字建立，並允許使用 `await` 暫停執行，直到耗時任務完成。這是我們在 Async Code 每天用來協調 API 呼叫、資料庫互動以及 React 和 Next.js 應用程式中複雜處理的模式。
`await` 關鍵字只能在宣告為 `async` 的函式內部使用。它放在任何回傳 Promise 的表達式前面：`const data = await fetch('/api/endpoint')`。函式的執行會暫停直到 Promise 解析完成，然後以回傳的值繼續執行。若要處理錯誤，請將 `await` 呼叫封裝在 `try/catch` 區塊中。這種方法產生清晰且循序的程式碼，比巢狀的 `.then()` 鏈更具可讀性。
Async/await 應系統性地用於 JavaScript 應用程式中的所有 I/O 操作：向外部 API 發送 HTTP 呼叫、查詢 MongoDB 或 PostgreSQL 資料庫、使用 Node.js 讀寫檔案，或管理計時器。它也是 Redux thunks 和 Next.js Server Components 的推薦語法。在 Async Code，我們團隊的名稱就反映了我們對這個範式的精通，它是我們每一行程式碼的核心。
`await` 關鍵字用於 JavaScript 中暫停非同步函式的執行，直到 Promise 被解析。它不會阻塞瀏覽器的主執行緒——它只暫停當前函式，允許其他任務繼續執行。正是這種非阻塞管理能力使 JavaScript 在即時網頁應用程式和我們為客戶部署的事件驅動架構中表現出色。
JavaScript 中的 Promise 是語言的原生機制，代表非同步操作的完成（或失敗）及其產生的值。Promise 在 ES6 引入，使非同步程式碼能以可讀的鏈式結構組織，而非回呼金字塔。結合 async/await（ES2017），它們提供優雅且穩健的語法來管理現代應用程式的複雜性。我們的團隊依賴這項基礎技術來建構可靠的後端架構與回應式前端介面。