數組遍歷
forEach 函數與 map 相似，但是它不返回結果，而是為每個元素運行該函數並丟棄結果。 實際上，重要的部分是調用函數的副作用。
例如，將每個元素同步打印到控制台
const arr = [1, 2, 3]; arr.forEach((i) => { console.log(i); }); // 1 // 2 // 3 console.log("完成同步"); // 完成同步由於結果並不重要，因此可以使用異步函數作為迭代器：
const arr = [1, 2, 3]; arr.forEach(async (i) => { // 每個元素需要花費不同的時間才能完成 await sleep(10 - i); console.log(i); }); console.log("完成異步"); // 完成異步 // 3 // 2 // 1
控制時間-等待完成
但是，並不奇怪，該函數被異步調用，並且程序沒有按時間順序完成。 這是與同步版本的重要區別，因為在執行下一行時，同步forEach已完成，而異步版本尚未完成。 因此，“完成異步”日志顯示在元素之前。
要在繼續進行之前等待所有函數調用完成，請使用帶有 Promise.all 的 map 並不要返回值：
const arr = [1, 2, 3]; await Promise.all(arr.map(async (i) => { await sleep(10 - i); console.log(i); })); // 3 // 2 // 1 console.log("完成異步"); // 完成異步
進行此更改后，“完成異步”排在最后。
控制順序-逐步完成
但是請注意，迭代函數是並行調用的。
若要忠實地遵循同步遍歷，可以在reduce中await累加器，即如下的await memo：
const arr = [1, 2, 3]; await arr.reduce(async (memo, i) => { await memo; await sleep(10 - i); console.log(i); }, undefined); // 1 // 2 // 3 console.log("完成異步"); // 完成異步
這樣，元素會依次處理，程序執行將等待整個數組完成后再繼續。
品牌vi設計公司http://www.maiqicn.com 辦公資源網站大全https://www.wode007.com
結論
異步的數組遍歷很容易使用，但是是用 forEach，map 或 reduce 取決於時序要求。
- 如果你只想在任何時候運行這些功能，請使用 forEach。
- 如果要確保繼續操作之前完成操作，請使用 map。
- 如果你需要一個一個地運行它們，請使用 reduce。