详解如何构建Promise队列实现异步函数顺序执行
场景
有a、b、c三个异步任务，要求必须先执行a，再执行b，最后执行c
且下一次任务必须要拿到上一次任务执行的结果，才能做操作
思路
我们需要实现一个队列，将这些异步函数添加进队列并且管理它们的执行，队列具有FirstInFirstOut的特性，也就是先添加进去的会被先执行，接着才会执行下一个(注意跟栈作区别)
大家也可以类比一下jQuery的animate方法，添加多个动画也会按顺序执行
解决
模拟3个异步函数
//异步函数a
vara=function(){
returnnewPromise(function(resolve,reject){
setTimeout(function(){
resolve('a')
},1000)
})
}
//异步函数b
varb=function(data){
returnnewPromise(function(resolve,reject){
resolve(data+'b')
})
}
//异步函数c
varc=function(data){
returnnewPromise(function(resolve,reject){
setTimeout(function(){
resolve(data+'c')
},500)
})
}
解决方法一(使用then链式操作)
特点：可以满足需求，但是书写比较繁琐
代码
//链式调用
a()
.then(function(data){
returnb(data)
})
.then(function(data){
returnc(data)
})
.then(function(data){
console.log(data)//abc
})
方法二(构建队列)
特点：封装方法，可移植到别处使用
代码
//构建队列
functionqueue(arr){
varsequence=Promise.resolve()
arr.forEach(function(item){
sequence=sequence.then(item)
})
returnsequence
}
//执行队列
queue([a,b,c])
.then(data=>{
console.log(data)//abc
})
方法三(使用async、await构建队列)
同方法二，只是显得更高大上点
代码
asyncfunctionqueue(arr){
letres=null
for(letpromiseofarr){
res=awaitpromise(res)
}
returnawaitres
}
queue([a,b,c])
.then(data=>{
console.log(data)//abc
})
顺便说一句，bluebird的Promise.reduce也可以用来顺序执行函数，但是可使用的场景非常有限，一般用来读取文件信息，而以上给出的方法，不管你在异步函数中做了什么，只要函数最后返回了一个Promise对象，都可以使用
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。