如何在 JavaScript For 迴圈中正確執行非同步進程？

JavaScript For 迴圈中非同步進程的順序執行

在JavaScript for 迴圈中建立非同步進程時，解決以下問題至關重要：維護循環變數值。預設情況下，循環在非同步進程完成之前完成，導致回調函數中的變數值不正確。

解決方案：

1. 利用函數閉包：

   透過建立內聯或外部對於循環的每次迭代，循環索引變數在閉包內被唯一捕獲。這確保每個回調都可以存取自己的索引值。

   範例1（內聯閉包）：

   someArray.forEach(function(item, i) {
       asynchronousProcess(function() {
           console.log(i);
       });
   });

   登入後複製

   範例2（外部閉包）：

   (function(i) {
       asynchronousProcess(function() {
           console.log(i);
       });
   })(i);
   ````

   登入後複製
   範例2（外部閉包）：

2. 範例2（外部閉包）：

   範例2（外部閉包）：

   for (let i = 0; i < 10; i++) {
       asynchronousProcess(function() {
           console.log(i);
       });
   }

   登入後複製

3. 利用ES6 Let：

   如果有符合 ES6 的 JavaScript 環境可用，let 關鍵字可用於 for 迴圈初始化。 let 為每個循環迭代建立一個唯一的變量，解決範圍問題。

   async function someFunction() {
       for (let i = 0; i < 10; i++) {
           await asynchronousProcess();
           console.log(i);
       }
   }

   登入後複製

4. 使用Promises 進行序列化：

   如果非同步進程返回承諾，可以使用async 和await 將它們序列化以一次運行一個。這保證了順序執行並防止循環繼續前進，直到每個非同步操作完成。

   function someFunction() {
       let promises = [];
       for (let i = 0; i < 10; i++) {
           promises.push(asynchonousProcessThatReturnsPromise());
       }
       return Promise.all(promises);

   登入後複製

以上是如何在 JavaScript For 迴圈中正確執行非同步進程？的詳細內容。更多資訊請關注PHP中文網其他相關文章！