js经常会遇到异步的执行,简单的异步执行可以使用回调,多个异步回调执行可以使用await/async解决。遇到多个不定的异步需要同步一个一个执行的时候,无法直接执行,例如多个网络请求,需要一个一个去执行,就会遇到任务队列串行执行的问题。
在遇到多个需要异步执行的promise时,可以直接使用promise提供了all方法同时执行多个promise,但是并未能解决异步的任务是不断产生的情况。在异步任务不断产生而且需要顺序的执行完一个才能执行下一个的情况下。使用定时器和队列来解决,新任务加入队列,队列不断拿出任务执行,就可以做到串行化执行了。
export interface PromiseQueueOptions {
interval?: number;
}
export default class PromiseQueue {
private interval?: any;
// 选项
private options: PromiseQueueOptions;
// 锁定
private lock = false;
// 队列
private queue: (() => Promise<any>)[] = [];
static instance(options: PromiseQueueOptions = {}): PromiseQueue {
if (options.interval == undefined) options.interval = 200;
return new PromiseQueue(options);
}
constructor(options: PromiseQueueOptions) {
this.options = options;
this.interval = setInterval(async () => {
// 没有任务或者任务执行中情况不执行
if (this.queue.length > 0 && !this.lock) {
console.log('execute queue');
// 锁定
this.lock = true;
// 取出函数
const f = this.queue.shift();
// 解锁
await f!();
this.lock = false;
}
}, options.interval);
}
// 加入队列
push(f: () => Promise<any>) {
this.queue.push(f);
}
// 释放队列
destory() {
clearInterval(this.interval);
}
}