在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 相关文章推荐
Javascript学习笔记 delete运算符
Sep 13 Javascript
js点击出现悬浮窗效果不使用JQuery插件
Jan 20 Javascript
js字符串操作方法实例分析
May 06 Javascript
JQuery中节点遍历方法实例
May 18 Javascript
JavaScript阻止回车提交表单的方法
Dec 30 Javascript
学习JavaScript设计模式之代理模式
Jan 12 Javascript
JavaScript重载函数实例剖析
May 13 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
Jun 22 Javascript
基于Bootstrap 3 JQuery及RegExp的表单验证功能
Feb 16 Javascript
将Sublime Text 3 添加到右键中的简单方法
Dec 12 Javascript
JavaScript数组、json对象、eval()函数用法实例分析
Feb 21 Javascript
详解Vue的组件中data选项为什么必须是函数
Aug 17 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 SQLite类
2009/05/07 PHP
PHP判断图片格式的七种方法小结
2013/06/03 PHP
php的zip解压缩类pclzip使用示例
2014/03/14 PHP
PHP中strncmp()函数比较两个字符串前2个字符是否相等的方法
2016/01/07 PHP
php中加密解密DES类的简单使用方法示例
2020/03/26 PHP
PHP如何通过带尾指针的链表实现'队列'
2020/10/22 PHP
JavaScript入门教程(11) js事件处理
2009/01/31 Javascript
jquery自定义下拉列表示例
2014/04/25 Javascript
JavaScript之Object类型介绍
2015/04/01 Javascript
jQuery遮罩层实现方法实例详解(附遮罩层插件)
2015/12/08 Javascript
JS实现回到页面顶部动画效果的简单实例
2016/05/24 Javascript
基于JavaScript FileReader上传图片显示本地链接
2016/05/27 Javascript
jQuery 跨域访问解决原理案例详解
2016/07/09 Javascript
深入浅析JS Function()构造函数
2016/08/22 Javascript
js实现带进度条提示的多视频上传功能
2020/12/13 Javascript
element-ui表格列金额显示两位小数的方法
2018/08/24 Javascript
JavaScript基于数组实现的栈与队列操作示例
2018/12/22 Javascript
javascript实现的时间格式加8小时功能示例
2019/06/13 Javascript
vue+canvas实现拼图小游戏
2020/09/18 Javascript
Python学习之asyncore模块用法实例教程
2014/09/29 Python
自己使用总结Python程序代码片段
2015/06/02 Python
Python3.6通过自带的urllib通过get或post方法请求url的实例
2018/05/10 Python
Python实现的绘制三维双螺旋线图形功能示例
2018/06/23 Python
Django 后台获取文件列表 InMemoryUploadedFile的例子
2019/08/07 Python
Python数据可视化:箱线图多种库画法
2019/11/06 Python
基于TensorFlow常量、序列以及随机值生成实例
2020/01/04 Python
利用python对excel中一列的时间数据更改格式操作
2020/07/14 Python
家用个人磨皮机:Trophy Skin
2017/03/30 全球购物
sealed修饰符是干什么的
2012/10/23 面试题
实习生个人的自我评价
2013/12/08 职场文书
5.1手机促销活动
2014/01/17 职场文书
企业人事任命书
2014/06/05 职场文书
经营目标管理责任书
2014/07/25 职场文书
2015年路政工作总结
2015/05/22 职场文书
基于nginx实现上游服务器动态自动上下线无需reload的实现方法
2021/03/31 Servers
CSS3 实现的图片悬停的切换按钮
2021/04/13 HTML / CSS