javascript - async/await 與 forEach 問題
問題描述
方法一:沒問題
(async function () {for (let i = 0; i < triggerArr.length; ++i) { await sleep(); triggerArr[i]();} })();
方法二:是一起輸出來的,為什么?(沒有等待)
const test = async function (item) { await sleep(); item(); }; triggerArr.forEach(test);
全部的代碼
function signalLamp(singalArr) { function tic(sign, delay) {return () => new Promise((res, rej) => { setTimeout(() => {res();console.log(sign); }, delay || 1000);}); } const rawArr = singalArr.slice(); const triggerArr = rawArr.reduce(function (prev, item) {return prev.concat([tic(item, 1000)]); }, []); const sleep = () => new Promise((res, rej) => setTimeout(res, 1000)); /* Method 1 */ (async function () {for (let i = 0; i < triggerArr.length; ++i) { await sleep(); triggerArr[i]();} })(); /* Method 2 */ // const test = async function (item) { // await sleep(); // item(); // }; // triggerArr.forEach(test);}signalLamp([’red’, ’green’, ’yellow’]);
問題解答
回答1:我給你講下。await 只能用于 async 聲明的函數上下文中. 如下 forEach 中, 是不能直接使用await的.
let array = [0,1,2,3,4,5];(async ()=>{ array.forEach(function(item){ console.log(item); await wait(1000);//這是錯誤的寫法 });})();//因await只能用于 async 聲明的函數上下文中, 故不能寫在forEach內.下面我們來看正確的寫法(async ()=>{ for(let i=0,len=array.length;i<len;i++){ console.log(array[i]); await wait(1000); }})();
仔細看下,發現你的問題是另外一種情況。你這樣把test當做回調函數傳入進去,sleep方法是同步執行的,await還是生效的,只是同時生效。因此后續函數在等待相同的時間后,一起執行。
回答2:async 做異步循環的時候最好用 for ... of ... 或者 Promise.all()
相關文章:
1. 淺談vue生命周期共有幾個階段?分別是什么?2. index.php錯誤,求指點3. 視頻 - html5 video的autoplay 在智能手機上不運作?4. javascript - 百度坐標,返回目標附近有哪些坐標5. css3 - 使用less編譯css后,后期的項目中less是直接放在項目文件中,后期如何維護呢6. css3 - 在css里面,樣式不生效問題7. node.js - 在阿里云搭建vue環境后npm run dev 沒有看到vue歡迎頁面而是 UnhandledPromiseRejection8. javascript - Jquary的contains如何做到精準匹配9. html5 - 前端面試碰到了一個緩存數據的問題,來論壇上請教一下10. javascript - ui-router AngularJS url顯示正常 頁面沒有變化?
