关于javascript:不知有多少个异步任务但当有任务的时候就需要按顺序执行js异步任务列队实现

30次阅读

共计 809 个字符,预计需要花费 3 分钟才能阅读完成。

本例子实用于以下环境:

  1. 当你有一堆异步工作须要 按程序执行 的时候;
  2. 当你不晓得有多少个异步工作须要按程序执行的时候;
    举例场景:
    有一个扫描仪,下面放有 N 个待扫描文件(其中有非凡文件须要分组);每次扫描实现后,扫描仪会将数据返回,且返回数据须要调用接口才能够辨认解决哪个是非凡文件用于分组。非凡文件前面的文件就属于以后这个组的;
    图来表述:


class AsyncTask {constructor() {this.queue = []; // 列队申请数组[promise]
        this.resolve = (res) =>{} // 列队每次申请完结后回调函数
        this.running = false; // 以后列队是否正在执行工作
    }
    
    /**
     * 触发异步申请,退出工作队列
     * 当队列中工作数大于 0 时,开始解决队列中的工作
     * @param {Promise} task 异步工作
     * @param {Array} image 影像回显列表
     */
    addQueue(task) {this.queue.push(task);
        if (this.queue.length > 0 && !this.running) {
            this.running = true
            this.process()}
    }
    process() {const item = this.queue.shift(); 
        if (item) {
            item.then(res => {this.resolve(res)
                this.process()})
        } else {this.running = false}
    }
}
export default new AsyncTask()

应用办法

import AsyncTask from "./asyncTask"
 // 扫描前将异步列队工作回调函数设置好
// doSomeThings 是申请完结后你要做的事件
AsyncTask.resolve = this.doSomeThing;
// ajax()是你的 promise 申请
AsyncTask.addQueue(ajax());

正文完
 0