异步流程控制 java_Javascript异步流程控制之串行执行详解
这篇文章主要讲一下如何串行执行一组异步任务,例如有下面几个任务,在这里我们用setTimeout模拟一个异步任务:
let taskA = () => setTimeout(() => console.log('run task A'), 100);
let taskB = () => setTimeout(() => console.log('run task B'), 50);
let taskC = () => setTimeout(() => console.log('run task C'), 150);
直接运行
taskA(); taskB(); taskC();
是达不到顺序执行A,B,C 的三个任务的效果的。
首先我们看一下最传统的做法,通过回调的方式在一个任务执行完成之后调用下一个任务:
let taskA = setTimeout(() => {
console.log('run task A');
taskB();
}, 100);
let taskB = setTimeout(() => {
console.log('run task B');
taskC();
}, 50);
let taskC = setTimeout(() => {
console.log('run task B');
}, 150);
第二种方法是将每一个任务封装成一个返回Promise的函数, 然后使用使用Promise的链式调用达到串行执行的目的:
let taskA = () => new Promise((resolve, reject) => {
setTimeout(() => {
console.log('run task A');
resolve();
}, 100);
})
let taskB = () => new Promise((resolve, reject) => {
setTimeout(() => {
console.log('run task B');
resolve();
}, 50);
})
let taskC = () => new Promise((resolve, reject) => {
setTimeout(() => {
console.log('run task C');
resolve();
}, 150);
})
function runTasks2() {
console.log('tasks 2');
taskA().then(taskB).then(taskC);
}
假设任务的数量不确定,可以通过下面的方式来执行:
function runTasks3(tasks) {
console.log('tasks 3');
let pro = tasks[0]();
for (let i = 1; i < tasks.length; i++) {
pro.then(tasks[i]);
}
}
借助于es7的async和await,我们还可以对上面的函数一种写法:
async function runTasks3_1(tasks) {
for (let i = 0; i < tasks.length; i++) {
await tasks[i]();
}
}
在文章的最后我们自己来实现一个串行执行器, 用于执行一组串行任务:
function async(tasks) {
const count = tasks.length;
let index = 0;
const next = () => {
if (index >= count) return;
const task = tasks[index++];
task(next);
}
next(0);
}
函数的使用方式如下:
async([
next => setTimeout(() => { console.log('taskA ...'); next() }, 100),
next => setTimeout(() => { console.log('taskB ...'); next() }, 50),
next => setTimeout(() => { console.log('taskC ...'); next() }, 30)
]);
在每一个子任务中我们通过调用next函数继续执行下一个子任务。
在具体的使用中可能会遇到函数之间传递参数的情况,即前一个任务的执行结果需要作为下一个任务的入参,这些都可以对上面的例子稍作修改就可以了~~
到此这篇关于Javascript异步流程控制之串行执行详解的文章就介绍到这了,更多相关Javascript串行执行内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!
异步流程控制 java_Javascript异步流程控制之串行执行详解相关推荐
- 影视后期行业概述、制作流程、岗位划分、薪资待遇、课程介绍详解
影视后期行业概述.制作流程.岗位划分.薪资待遇.课程介绍详解 本篇围绕影视后期行业概念定义.应用与细分.影视制作流程.市场上职责岗位划分.影视后期课程详情.影视后期薪资结构与前景.授课方式与课程划分. ...
- Promise相关内容(三)——异步获取服务器数据:promise方式解决回调地狱的问题。通过多个.then使代码可读性更高 实现异步任务的串行执行,保证按顺序发送请求获取数据
Promise相关内容(三)--异步获取服务器数据:promise方式解决回调地狱的问题.通过多个.then使代码可读性更高 & 实现异步任务的串行执行,保证按顺序发送请求获取数据 第一种形式 ...
- Rocksdb 写流程,读流程,WAL文件,MANIFEST文件,ColumnFamily,Memtable,SST文件原理详解
文章目录 前言 Rocksdb写流程图 WAL 原理分析 概述 文件格式 查看WAL的工具 创建WAL 清理WAL MANIFEST原理分析 概述 查看MANIFEST的工具 创建 及 清除 MANI ...
- 【异步编程学习笔记】JDK中的FutureTask和CompletableFuture详解(使用示例、源码)
文章目录 FutureTask概述 使用实例 类图结构 FutureTask的run()方法 FutureTask的局限性 CompletableFuture概述 CompletableFuture代 ...
- 网页编程html link,Web--CSS控制页面(link与import方式区别)详解
先了解: [1] "Table"和"DIV"这两个网页元素诞生的目的不同,首先Table诞生的目的是为了存储数据,而DIV诞生的目的就是为了架设页面 ...
- 异步FIFO设计:各个模块的作用及Verilog代码详解
实现原理参考:异步FIFO---Verilog实现_alangaixiaoxiao的博客-CSDN博客_异步fifo 代码参考:IC基础(一):异步FIFO_MaoChuangAn的博客-CSDN博客 ...
- 51单片机~运放控制声控电路,运算放大器(各模式精细详解),NE555时基电路芯片分析
51单片机~运放控制声控电路 (一)驻极体话筒: (二)运算放大器: 说明:在使用时V+和V-之间没有压差不进行电路放大,但是一旦有了压差,就成为运算放大器, (1)单电源:V+ > V-时,输 ...
- 一台计算机连接两个投影,用一台PC控制四台投影 投影机多屏幕演示功能详解
赵国臣 多屏幕演示1 多屏幕演示2 为了满足用户多元化的应用需求,陆续有投影厂商推出了极具个性化的投影产品.在商务投影机中,新开发的多屏幕演示功能逐渐被用户所关注. 多屏幕演示就是使用一台计算机可以控 ...
- python控制画笔尺寸,Python画笔的属性及用法详解
画笔有颜色.画线的宽度等属性. 1.turtle.pensize():设置画笔的宽度: 2.turtle.pencolor():没有参数传入返回当前画笔颜色:传入参数设置画笔颜色,可以是字符串如&qu ...
- 网际控制报文协议ICMP(Internet Control Message Protocol)(详解)
一.回顾下TCP/IP协议栈 二.ICMP(Internet Control Message Protocol)协议概述 三.ICMP协议的组成 四.ICMP差错报告报文(5种): 终点不可达:当路由 ...
最新文章
- 生物信息大数据数据库(NCBI、EBI、UCSC、TCGA)
- 利用for循环完成你的第一个脚本
- macos mysql 阿帕奇_Mac配置apache,mysql
- 详谈asp生成静态页方法
- MySql 查询显示
- 信息学奥赛一本通(1161:转进制)
- pytorch1.7教程实验——DCGAN生成对抗网络
- Python返回数组(List)长度的方法
- 自动化测试的点点滴滴经验积累
- opencv成员函数data,step,at的使用
- c++ 4种新型的类型static_cast、dynamic_cast、reinterpret_cast、const_cast转换运算符
- python黑屏改成白底_Python 进行黑屏 PNR 的提取
- 计算机领域国际期刊,科学网—计算机国际期刊zz - 黄红星的博文
- java全栈开发工程师_谈谈我对Java(J2EE)全栈工程师的理解
- vue 安装(看图就够了,皮卡皮卡)
- Node Sass找不到您当前环境的绑定
- 如何查阅NLP资料 转自https://blog.csdn.net/qq_27009517/article/details/80841146
- Python3-标准库概览
- 打印两个字符串的公共字符
- sql 如果不存在则插入,存在则不操作或修改
热门文章
- spark 稀疏矩阵存储详细解读
- spark 两个rdd求交集,差集,并集
- 【图论】拓扑排序:一个名字高大上的实际很简单的算法(图文详解)
- jdbc连接数据库mysql视频_jdbc连接数据库mysql视频
- php curl 错误码,php,_PHP curl 错误 :curl__errno()返回错误码6,php - phpStudy
- c语言指针动态分配数组长度,C语言安全之数组长度与指针实例解析
- jdbctemplate mysql blob_JdbcTemplate 操作Oracle Blob
- 实参与形参不兼容_python学习笔记------形参实参2
- python获取音频音量大小_如何在python中规范化音频文件的音量:当前可用的任何包?...
- android 手机内存uri_Android通过Uri转化为本地绝对路径的方案(全版本适配4.1-7.0)...