await 与 Promise.all 结合使用
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了await 与 Promise.all 结合使用相关的知识,希望对你有一定的参考价值。
参考技术A 当遇到多个可以同时执行的异步任务时,就需要使用 Promise.all 。Promise.all 方法用于将多个 Promise 实例,包装成一个新的 Promise 实例。
Promise.all 方法接受一个数组作为参数,p1、p2、p3 都是 Promise 实例,如果不是,就会先调用 Promise.resolve 方法,将参数转为 Promise 实例,再进一步处理。(Promise.all 方法的参数可以不是数组,但必须具有 Iterator 接口,且返回的每个成员都是 Promise 实例。)
而 async/await 本身就是 promise 的语法糖,因此可以与 Promise.all 结合使用:
promise/axios async/await使用方法汇总
方法汇总
promise与axios结合使用
1.创建公共请求
promiseFunc: (url) => {
// 返回一个promise对象
return new Promise((resolve, reject) => {
axios({
url: url
method: 'post',
data: {
}
})
.then((res) => {
//此处为请求成功数据
resolve(res.data);
})
.catch(error => {
//此处为请求失败数据
reject(error);
});
});
}
2.调用公共请求方法
this.promiseFunc(url).then((res) => {
//成功
console.log(res.data);
}).catch(error => {
//失败
console.log(error);
});
promise请求进行多次回调
1.promise 链式请求
//promise then方法返回的是一个全新的promise对象
promiseFunc: () => {
new Promise((resolve, reject) => {
setTimeout(() => {
resolve()
},1000)
})
}
promiseFunc().then(promiseFunc())
.then(promiseFunc())
.then(promiseFunc())
.then(promiseFunc());
2.使用promise.all
注意:只要有一个接口失败了,则会先返回失败的数据。只有所有接口都成功时才会返回一个数组
let p1 = new Promise((resolve,reject) => {
resolve()
})
let p2 = new Promise((resolve,reject) => {
resolve()
})
let p3 = new Promise((resolve,reject) => {
resolve()
})
Promise.all([p1, p2, p3]).then(res => {
console.log(res)
}).catch(err => {
console.log(err)
})
3.使用promise.race
注意:会返回最先获取成功的数据,拿个快就先返回哪个,无论成功还是失败
let p1 = new Promise((resolve,reject) => {
resolve()
})
let p2 = new Promise((resolve,reject) => {
resolve()
})
let p3 = new Promise((resolve,reject) => {
resolve()
})
Promise.race([p1, p2, p3]).then(res => {
console.log(res)
}).catch(err => {
console.log(err)
})
结合async/await进行多次回调
当一个方法前面加了async,那么它就变成了一个异步方法
await会阻塞进程,等上一个执行完毕,再执行下一个
async function a1() {
return res;
}
async function a2() {
return res;
}
let a1 = await a1();
let a2 = await a2();
console.log(a1, a2)
以上是关于await 与 Promise.all 结合使用的主要内容,如果未能解决你的问题,请参考以下文章
promise/axios async/await使用方法汇总
promise,async await,try catch的问题整理