js循环中使用async/await踩过的坑
2018-11-15 16:46
661 查看
最近写koa的时候遇见需要在循环中使用async/await的情况,当然第一反应就是直接上
forEach,然后就直接翻车了。。。
直接上代码:
function handleSql(val) { return new Promise((resolve) => { setTimeout(() => { console.log(`延时${val}秒触发`) resolve(val); }, 1000); }) } [1,2,3].forEach(async index => { console.log('调用await之前',index) const result = await handleSql(index); console.log('调用await之后',index) })
在我的预期中应该是这样输出的:
结果他是这样输出的:
先循环3次执行
console.log('调用await之前',index)语句,然后等待一秒后执行了
console.log(`延时${val}秒触发`)和
console.log('调用await之后',index)语句。
查了一下MDN的forEach文档发现有这么一句话:
注意: 没有办法中止或者跳出 forEach 循环,除了抛出一个异常。如果你需要这样,使用forEach()方法是错误的,你可以用一个简单的循环作为替代。
原来是forEach中不支持这种骚操作,果断换成普通的for循环或者for ... of:
async function forFn() { for(let index of [1,2,3]){ console.log('调用await之前',index) const result = await handleSql(index); console.log('调用await之后',index) } } async function forFn() { for(var index = 1;index<4;index++) { console.log('调用await之前',index) const result = await handleSql(index); console.log('调用await之后',index) } }
执行后的效果就是我们的预期效果:
相关文章推荐
- 在JS循环中使用async/await的方法
- async/await - 8.在for循环中正确的使用await
- JavaScript是如何工作的:事件循环和异步编程的崛起 + 5种使用 async/await 更好地编码方式!
- 优化JS中的Async/Await 使用
- 在 Silverlight 5 项目中使用 async/await
- js---javaScript(循环语句的使用实例)for while do....while(转移语句): break, continue , return
- 不要在 ASP.NET 4.5 Beta 的 Page 类事件上直接使用 async 与 await
- 使用 Async 和 Await 的异步编程
- [C#] .NET4.0中使用4.5中的 async/await 功能实现异
- 使用async/await——Nodejs+ExpressJs+Babel
- 介绍.net 4.5 异步编程核心内容,如何使用Async和Await进行异步编程
- JS对异步循环使用递归
- 使用 Async 和 Await 的异步编程
- await和async在一般处理程序中的使用
- asp.net webform中使用async,await实现异步操作
- Node.js Async Await in ES7
- ES7 中使用 async/await 解决回调函数嵌套问题
- Promise 、Async/Await的使用
- 在Windows Phone和Silverlight 4中可以使用Async和Await特性了
- js模版引擎handlebars.js实用教程——each-循环中使用this