promise
是一个拥有 then
方法的对象或函数,其行为符合本规范;
then
方法接受两个参数 onFulfilled
, onRejected
。前者是成功的回调,后者是失败的回调。如果Promise里面执行的是resolve进入onFulfilled
,执行reject进入onRejected
。
new Promise((reslove, reject) => {
console.log(1111);
setTimeout(() => {
console.log('setTimeut', 2222);
reslove(1);
}, 1000);
}).then(
res => {
console.log(3333);
},
err => console.log(err),
);
// 1111
// setTimeout 2222
// 3333
Promise.all
使用场景:一次请求多个接口,需要拿到全部信息后进行操作。
let promise1 = Promise.resolve(1111);
let promise2 = new Promise((resolve, reject) => {
setTimeout(resolve, 1000, 2222); // setTimeout的第三个参数会传入setTimeout第一个参数也就是执行方法里
});
let promise3 = new Promise((resolve, reject) => {
setTimeout(resolve, 2000, 3333);
});
Promise.all([promise1, promise2, promise3]).then((values) => {
console.log(values);
}).catch((err) => console.log(err));
// [1111, 2222, 3333]
只要任意一个Promise变成rejected状态都会走catch
let promise1 = Promise.resolve(1111);
let promise2 = new Promise((resolve, reject) => {
setTimeout(reject, 1000, 2222);
});
let promise3 = new Promise((resolve, reject) => {
setTimeout(resolve, 2000, 3333);
});
Promise.all([promise1, promise2, promise3]).then((values) => {
console.log(values);
}).catch((err) => console.log(err));
// 2222
// promise2 里面换成了reject,直接走catch
Promise.allSettled
无论是有失败的请求,他都会走then并用对象将结果包起来
let promise1 = Promise.resolve(1111);
let promise2 = new Promise( (resolve, reject) => {
setTimeout(reject, 1000, 2222);
});
let promise3 = new Promise( (resolve, reject) => {
setTimeout(resolve, 2000, 3333);
});
Promise.allSettled([promise1, promise2, promise3])
.then((values) => {
console.log(values);
})
.catch((err) => console.log(err));
// [
// { status: 'fufilled', value: 1111 },
// { status: 'rejected', value: 2222 },
// { status: 'fufilled', value: 3333 }
// ]
Promise.race
多个请求中,那个先执行就返回该请求的结果
let promise2 = new Promise( (resolve, reject) => {
setTimeout(resolve, 1000, 2222);
});
let promise3 = new Promise( (resolve, reject) => {
setTimeout(resolve, 2000, 3333);
});
Promise.race([ promise2, promise3])
.then( (values) => {
console.log(values);
})
// 2222
Promise 值穿透 及如何中断Promise 链式请求
穿透
Promise.resolve(1)
.then(2) // 注意这里
.then(Promise.resolve(3))
.then(console.log); // 输出1 这里写法等于 .then(e => console.log(e))
return 一个值修改下一个then里面的value
Promise.resolve(1)
.then(() => 2)
.then(Promise.resolve(3))
.then(console.log) // 输出2
Promise.resolve(1)
.then(() => 2)
.then(() => Promise.resolve(3))
.then(console.log) // 输出3
中断Promise只有一种方法,那就是让他的状态变始终停留在pending
Promise是有三种状态 pending,fulfilled,rejected
const promise = new Promise((resolve, reject) => {
resolve(111);
}).then((res) => {
console.log(res) //打印111
return 222
}).then(res => {
console.log(res) //打印222
return new Promise(() => {})
}).then(res => {
console.log(3333) //不会打印,被中断了
})