在JS循环中使用async/await的方法


Posted in Javascript onOctober 12, 2018

async / await是ES7的重要特性之一,也是目前社区里公认的优秀异步解决方案。目前,async / await这个特性已经是stage 3的建议,可以看看TC39的进度,本篇文章将分享在JS循环中使用async/await的方法.

在开发maty.js时,遇到一个数组任务,数组项是内部异步执行的函数,期望是同步依次执行每项函数,每项函数执行完本身的异步任务后,继续下一项。

刚开始单纯使用map来循环执行,并且await每项函数。如下所示:

starters.map(async (fn, i)=> {
 console.log('++++++++++: ', i)
 await fn(ctx);
});

结果是依次先输出了索引i,而不是阻塞每次循环,按期望执行。

搬出Google大法,可以看出对在 for…of 循环语法中使用await是有效的。

for (const fn of starters) {
 await fn(ctx);
}

同时文章中指出使用Promise.all,是无法解决当前问题的,因为all方法是并行运行的。很奇怪为什么没有串行执行的原生方法。

总结

以上所述是小编给大家介绍的在JS循环中使用async/await的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
node.js中的fs.mkdirSync方法使用说明
Dec 17 Javascript
jQuery切换所有复选框选中状态的方法
Jul 02 Javascript
javascript实现类似百度分享功能的方法
Jul 27 Javascript
JavaScript使用DeviceOne开发实战(二) 生成调试安装包
Dec 01 Javascript
基于JS实现移动端访问PC端页面时跳转到对应的移动端网页
Dec 24 Javascript
jQuery动态添加可拖动元素完整实例(附demo源码下载)
Jun 21 Javascript
JavaScript中数组slice和splice的对比小结
Sep 22 Javascript
记录vue做微信自定义分享的一些问题
Sep 12 Javascript
Vue 实现一个命令式弹窗组件功能
Sep 25 Javascript
Vue自定义组件的四种方式示例详解
Feb 28 Javascript
Vue中keep-alive 实现后退不刷新并保持滚动位置
Mar 17 Javascript
vue3.0 上手体验
Sep 21 Javascript
代码实例ajax实现点击加载更多数据图片
Oct 12 #Javascript
vue项目环境变量配置的实现方法
Oct 12 #Javascript
原生JS实现自定义下拉单选选择框功能
Oct 12 #Javascript
原生JS实现轮播图效果
Oct 12 #Javascript
详解KOA2如何手写中间件(装饰器模式)
Oct 11 #Javascript
Element Input组件分析小结
Oct 11 #Javascript
element el-input directive数字进行控制
Oct 11 #Javascript
You might like
详解PHP用substr函数截取字符串中的某部分
2016/12/03 PHP
php array_map()函数实例用法
2021/03/03 PHP
jQuery 属性选择器element[herf*='value']使用示例
2013/10/20 Javascript
javascript与cookie 的问题详解
2013/11/11 Javascript
JQuery获取表格数据示例代码
2014/05/26 Javascript
jQuery中Ajax的get、post等方法详解
2015/01/20 Javascript
解决node-webkit 不支持html5播放mp4视频的方法
2015/03/11 Javascript
详解Python中logging日志模块在多进程环境下的使用
2016/12/26 Javascript
基于jQuery对象和DOM对象和字符串之间的转化实例
2017/08/08 jQuery
用React-Native+Mobx做一个迷你水果商城APP(附源码)
2017/12/25 Javascript
Angular实现的简单查询天气预报功能示例
2017/12/27 Javascript
Vue组件的使用教程详解
2018/01/05 Javascript
微信小程序引入VANT组件的方法步骤
2019/09/19 Javascript
vue表单中遍历表单操作按钮的显示隐藏示例
2019/10/30 Javascript
环形加载进度条封装(Vue插件版和原生js版)
2019/12/04 Javascript
微信小程序登录时如何获取input框中的内容
2019/12/04 Javascript
vue 动态创建组件的两种方法
2020/12/31 Vue.js
[02:04]2020年夜魇暗潮预告片
2020/10/30 DOTA
利用Python中unittest实现简单的单元测试实例详解
2017/01/09 Python
python 实现在tkinter中动态显示label图片的方法
2019/06/13 Python
Python 中的参数传递、返回值、浅拷贝、深拷贝
2019/06/25 Python
Python matplotlib绘制饼状图功能示例
2019/09/10 Python
Python3 读取Word文件方式
2020/02/13 Python
python判断all函数输出结果是否为true的方法
2020/12/03 Python
用CSS3的box-reflect来制作倒影效果
2016/11/15 HTML / CSS
html5标记文字_动力节点Java学院整理
2017/07/11 HTML / CSS
英国领先的家庭时尚品牌:Peacocks
2018/01/11 全球购物
LivingSocial爱尔兰:爱尔兰本地优惠
2018/08/10 全球购物
大学生农村教师实习自我鉴定
2013/09/21 职场文书
《路旁的橡树》教学反思
2014/04/07 职场文书
《翻越远方的大山》教学反思
2014/04/13 职场文书
《三亚落日》教学反思
2014/04/26 职场文书
毕业生应聘求职信
2014/07/10 职场文书
查摆剖析材料范文
2014/09/30 职场文书
捐款感谢信
2015/01/20 职场文书
导游词之泉州崇武古城
2019/12/20 职场文书