資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
服裝設計
法律研究如何使用 async/await 和 Promise 在 JavaScript 中延遲迴圈？
在非同步程式設計中，一些耗時的任務在不阻塞主執行緒的情況下執行。在某些情況下，開發人員可能需要延遲迴圈的執行來控制程式的流程或在迭代之間引入延遲。JavaScript 提供了幾種延遲執行的技術，本文將探討如何使用 async/await 和 Promise 的組合來延遲迴圈。
瞭解 async/await
async/await 語法是在 ECMAScript 2017 (ES8) 中引入的，它提供了一種簡潔易讀的方式來編寫非同步程式碼。它建立在 Promise 之上，允許開發人員以同步的方式編寫非同步程式碼。async 關鍵字用於宣告非同步函式，await 關鍵字用於暫停函式的執行，直到 Promise 被解決或拒絕。
使用 Promise 進行延遲
Promise 是 JavaScript 物件，表示非同步操作的最終完成或失敗。透過利用 Promise，我們可以在程式碼執行中引入延遲。我們可以使用 setTimeout 函式建立一個在指定持續時間後解析的 Promise。
虛擬碼
async function functionName() {
// Asynchronous code
const result = await promise;
// Execution pauses until the promise is resolved
// Code after await is executed when the promise is resolved
}
這裡：
async 關鍵字用於宣告非同步函式。它可以放在函式宣告、函式表示式或箭頭函式之前。
函式體包含將非同步執行的程式碼。
await 關鍵字用於暫停函式的執行，直到 Promise 被解決或拒絕。
await 關鍵字只能在 async 函式內部使用。
promise 表示正在等待的 Promise 物件。它可以是任何 Promise，例如非同步操作的結果或手動建立的 Promise。
注意
await 只能在 async 函式中使用。
Await 可以與任何返回 Promise 的表示式一起使用（例如，async 函式、API 呼叫、setTimeout 等）。
使用 await 允許你以更同步和易讀的方式編寫非同步程式碼。
示例
在下面的示例中，我們定義了一個名為 delay 的函式，它返回一個 Promise。此 Promise 使用 setTimeout 和 resolve 回撥在指定的持續時間 (ms) 後解析。接下來，我們宣告一個名為 delayedLoop 的 async 函式，它將執行延遲迴圈。在 delayedLoop 函式內部，我們使用傳統的 for 迴圈和迴圈變數 `i` 迭代五次。對於每次迭代，我們使用 console.log 記錄一條訊息，指示當前的迭代次數。然後，我們使用 await 關鍵字後跟 delay 函式，並傳遞所需的延遲持續時間 1000 毫秒（1 秒）。這會導致迴圈的執行暫停指定的延遲持續時間，然後再繼續進行下一次迭代。最後，我們呼叫 delayedLoop 函式以啟動迴圈。
function delay(ms) {
return new Promise(resolve => setTimeout(resolve, ms));
}
async function delayedLoop() {
for (let i = 0; i < 5; i++) {
console.log(`Iteration ${i}`);
await delay(1000); // Delaying for 1 second (1000 milliseconds)
}
}
delayedLoop();
輸出
迴圈的每次迭代都延遲一秒，如 await delay(1000) 語句指定的那樣。
Iteration 0 [waits for 1 second] Iteration 1 [waits for 1 second] Iteration 2 [waits for 1 second] Iteration 3 [waits for 1 second] Iteration 4
結論
在本文中，我們討論瞭如何使用 async/await 和 Promise 在 javascript 中延遲迴圈。此延遲允許更受控制且順序地執行程式碼，這在我們需要同步 API 呼叫、實現定時間隔或出於各種原因引入暫停的情況下特別有用。async/await 和 Promise 的組合提供了一種優雅的解決方案來延遲迴圈執行，而不會阻塞執行的主執行緒，從而使 JavaScript 程式更有效率和響應更快。
3K+ 閱讀量
