在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 相关文章推荐
客户端静态页面玩分页
Jun 26 Javascript
dojo 之基础篇(二)之从服务器读取数据
Mar 24 Javascript
二行代码解决全部网页木马
Mar 28 Javascript
node.js中的fs.fstat方法使用说明
Dec 15 Javascript
JavaScript中的异常捕捉介绍
Dec 31 Javascript
用file标签实现多图文件上传预览
Feb 14 Javascript
微信小程序实现传参数的几种方法示例
Jan 10 Javascript
微信小程序实现滚动消息通知
Feb 02 Javascript
vue使用ElementUI时导航栏默认展开功能的实现
Jul 04 Javascript
PWA介绍及快速上手搭建一个PWA应用的方法
Jan 27 Javascript
Vue实现购物车详情页面的方法
Aug 20 Javascript
js表达式与运算符简单操作示例
Feb 15 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 类中的常量、静态属性、非静态属性的区别
2017/04/09 PHP
PHP+AJAX 投票器功能
2017/11/11 PHP
PHP超低内存遍历目录文件和读取超大文件的方法
2019/05/01 PHP
javascript判断单选框或复选框是否选中方法集锦
2007/04/04 Javascript
基于jQuery制作迷你背词汇工具
2010/07/27 Javascript
JavaScript高级程序设计(第3版)学习笔记3 js简单数据类型
2012/10/11 Javascript
Jquery中LigerUi的弹出编辑框(实现方法)
2013/07/09 Javascript
深入理解javascript原型链和继承
2014/09/23 Javascript
提交按钮的name='submit'引起的js失效问题及原因
2015/02/25 Javascript
jQuery设置和移除文本框默认值的方法
2015/03/09 Javascript
超赞的动手创建JavaScript框架的详细教程
2015/06/30 Javascript
javascript实现多栏闭合展开式广告位菜单效果实例
2015/08/05 Javascript
jQuery实现网页抖动的菜单抖动效果
2015/08/07 Javascript
微信小程序 详解Page中data数据操作和函数调用
2017/01/12 Javascript
在javaScript中检测数据类型的几种方式小结
2017/03/04 Javascript
vue 组件高级用法实例详解
2018/04/11 Javascript
Angular6 发送手机验证码按钮倒计时效果实现方法
2019/01/08 Javascript
详解js获取video任意时间的画面截图
2019/04/17 Javascript
vue缓存的keepalive页面刷新数据的方法
2019/04/23 Javascript
javascript实现滚动条效果
2020/03/24 Javascript
[47:36]Optic vs Newbee 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
[01:32]dota2拉比克至宝(222)
2018/12/20 DOTA
python获得linux下所有挂载点(mount points)的方法
2015/04/29 Python
用Python操作字符串之rindex()方法的使用
2015/05/19 Python
Python实现生成随机日期字符串的方法示例
2017/12/25 Python
对Django中内置的User模型实例详解
2019/08/16 Python
Python之Numpy的超实用基础详细教程
2019/10/23 Python
python 实现Requests发送带cookies的请求
2021/02/08 Python
英国家电直销:Appliances Direct
2016/09/22 全球购物
蔻驰英国官网:COACH英国
2020/07/19 全球购物
干部鉴定材料
2014/05/18 职场文书
项目申报专员岗位职责
2014/07/09 职场文书
医院消毒隔离制度
2015/08/05 职场文书
写给医护人员的一封感谢信
2019/09/16 职场文书
Mysql中一千万条数据怎么快速查询
2021/12/06 MySQL
vue 自定义组件添加原生事件
2022/04/21 Vue.js