在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一点特殊用法
May 28 Javascript
Javascript 圆角div的实现代码
Oct 15 Javascript
用JS写的一个TableView控件代码
Jan 23 Javascript
jQuery常用数据处理方法小结
Feb 20 Javascript
基于jQuery实现Div窗口震动特效代码-代码简单
Aug 28 Javascript
很棒的Bootstrap选项卡切换效果
Jul 01 Javascript
ECMAScript6轮播图实践知识总结
Aug 17 Javascript
javascript入门之window对象【新手必看】
Nov 22 Javascript
Angular中使用better-scroll插件的方法
Mar 27 Javascript
Vue实现微信支付功能遇到的坑
Jun 05 Javascript
基于ts的动态接口数据配置的详解
Dec 18 Javascript
手把手教您实现react异步加载高阶组件
Apr 07 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合并js请求的例子
2013/11/01 PHP
Smarty简单生成表单元素的方法示例
2016/05/23 PHP
Laravel5权限管理方法详解
2016/07/26 PHP
理清PHP在Linxu下执行时的文件权限方法
2017/06/07 PHP
Laravel框架查询构造器 CURD操作示例
2019/09/04 PHP
PHP $O00OO0=urldecode & eval 解密,记一次商业源码的去后门
2020/09/13 PHP
jQuery登陆判断简单实现代码
2013/04/21 Javascript
Asp.Net alert弹出提示信息的几种方法总结
2014/01/29 Javascript
超链接的禁用属性Disabled使用示例
2014/07/31 Javascript
JavaScript字符串对象replace方法实例(用于字符串替换或正则替换)
2014/10/16 Javascript
Javascript中的Prototype到底是什么
2016/02/16 Javascript
jQuery绑定事件-多种实现方式总结
2016/05/09 Javascript
javascript回到顶部特效
2016/07/30 Javascript
jQuery 检查某个元素在页面上是否存在实例代码
2016/10/27 Javascript
jQuery插件HighCharts实现2D柱状图、折线图的组合多轴图效果示例【附demo源码下载】
2017/03/09 Javascript
vue表单绑定实现多选框和下拉列表的实例
2017/08/12 Javascript
使用Angular CLI进行单元测试和E2E测试的方法
2018/03/24 Javascript
vue的diff算法知识点总结
2018/03/29 Javascript
nodejs使用node-xlsx生成excel的方法示例
2019/08/22 NodeJs
VSCode Vue开发推荐插件和VSCode快捷键(小结)
2020/08/08 Javascript
python 中的列表解析和生成表达式
2011/03/10 Python
使用pygame写一个古诗词填空通关游戏
2019/12/03 Python
python shell命令行中import多层目录下的模块操作
2020/03/09 Python
纯css3实现鼠标经过图片显示描述的动画效果
2014/09/01 HTML / CSS
H5 canvas中width、height和style的宽高区别详解
2018/11/02 HTML / CSS
详解通过focusout事件解决IOS键盘收起时界面不归位的问题
2019/07/18 HTML / CSS
俄罗斯和世界各地的酒店预订:Hotels.com俄罗斯
2016/08/19 全球购物
瑞士设计师家具和家居饰品网上商店:Bruno Wickart
2019/03/18 全球购物
请编程遍历页面上所有 TextBox 控件并给它赋值为 string.Empty
2015/12/03 面试题
法律专业应届本科毕业生求职信
2013/10/25 职场文书
中专生职业生涯规划书范文
2014/01/10 职场文书
一位农村小子的自荐信
2014/04/07 职场文书
2015少先队大队辅导员工作总结
2015/07/24 职场文书
2016元旦主持人经典开场白台词
2015/12/03 职场文书
《乌鸦喝水》教学反思
2016/02/19 职场文书
2016年小学植树节活动总结
2016/03/16 职场文书