有没有童鞋遇到过同样的问题：如何实现异步队列，javascript

Question

有三个执行函数，如何通过一个异步队列执行函数，使其能按照参数顺序依次输出?functionf1(){setTimeout(function(){console.log('f1')},300)}functionf2(){setTimeout(function(){console.log('f2')},100)}functionf3(){setTimeout(function(){console.log('f3')},200)}functiondoWork(list){//TODO}doWork([f1,f2,f3])//期待结果：f1f2f3

Answer 1

functionf1(){returnnewPromise(function(resolve,reject){setTimeout(function(){resolve('f1');},300);});};//异步函数bfunctionf2(data){returnnewPromise(function(resolve,reject){setTimeout(function(){resolve(data+'f2');},100);});};//异步函数cfunctionf3(data){returnnewPromise(function(resolve,reject){setTimeout(function(){resolve(data+'f3');},200);});};f1().then(function(data){returnf2(data);}).then(function(data){returnf3(data);}).then(function(data){console.log(data);//abc});

marcotask和microtask

　　js中异步队列可以分为两类,marcotask队列和microtask队列, marcotask队列里面包含有1.script中的所有同步代码,2.setTimeout,3. setInterval,4.setImmediate5. I/O操作, 6. UI渲染,而microtask队列主要是有1.process,2.nextTick, 3.promise等等,  异步队列执行的顺序主要是 先从marcotask中取出一个任务(第一次就是取出所有同步的代码),执行完成之后从microtask队列取出所有的任务,执行完成之后, 再从marcotask队列中取出一个, 循环往复,直到所有队列的任务被完成.

Answer 2

functionf(v){
returnnewPromise((resolve,reject)=>{
setTimeout(function(){
resolve(v)
},300)
})
}
f1=f('f1')
f2=f('f2')
f3=f('f3')
f1.then((v)=>{
console.log(v)
returnf2
}).then((v)=>{
console.log(v)
returnf3
}).then((v)=>{
console.log(v)
})
依次输出f1f2f3，这是Promise最基本的使用，觉得then麻烦就使用async/await:
(async()=>{
varpromiseQueue=[f1,f2,f3]
for(pofpromiseQueue){
letv=awaitp
console.log(v)
}
})()