一、Promise基础定义相关
Promise是一个构造函数,调用时需要使用new关键字
Promise是解决回调地狱的一种异步解决方式
Promise有三个状态:pending(进行中)、fulfilled(成功)、rejected(失败)
Promise的状态只会从 pending→fulfilled 或者 pending→rejected ,并且不会再改变
new Promise((resolve, reject) => {
if ('成功') {
resolve('.then回调函数的参数')
} else {
reject('.catch回调函数的参数')
}
})
二、Promise的实例方法
- then 成功时调用
- catch 失败时调用
- finally 成功失败都会调用
1、then方法支持链式调用,可同时执行多个then方法
后续then方法接收到的参数为前面一个then方法的返回值(为空时是undefined)
new Promise((resolve, reject) => {
resolve(1)
}).then(res => {
console.log(res); // 1
return 2
}).then(res => {
console.log(res); // 2
}).then(res => {
console.log(res); // undefined
return 3
}).then(res => {
console.log(res); // 3
})
2、then方法链式回调时,有一个返回reject就会执行catch方法
new Promise((resolve, reject) => {
resolve(1)
}).then(res => {
console.log(res); // 1
return new Promise((resolve, reject) => {
reject(999)
})
}).then(res => {
console.log(res);
}).then(res => {
console.log(res);
return 3
}).then(res => {
console.log(res);
}).catch((err) => {
console.log(err); // 999
})
三、Promise的静态方法
1、all( [] )
参数是promise实例数组
将多个promise实例放到一起去处理,全部为成功时执行then,有一个失败就执行catch
let p1 = new Promise((resolve, reject) => {
resolve(11)
})
let p2 = new Promise((resolve, reject) => {
reject(22)
})
let p3 = new Promise((resolve, reject) => {
reject(33)
})
Promise.all([p1, p2, p3]).then((result) => {
console.log(result); // [返回值1,返回值2,...]
}).catch(err => {
console.log(err); // 第一个失败的返回值 22
})
2、allSettled( [] )
参数是promise实例数组
所有实例状态都有结果了就执行then,无论成功失败
let p1 = new Promise((resolve, reject) => {
resolve(11)
})
let p2 = new Promise((resolve, reject) => {
reject(22)
})
let p3 = new Promise((resolve, reject) => {
reject(33)
})
Promise.all([p1, p2, p3]).then((result) => {
// [{status:'fulfilled',value:'返回值'},{status:'rejected',reason:'失败的原因'}]
console.log(result);
})
3、any()
参数是promise实例数组
任一实例成功时执行then,全部都未成功时执行catch
4、race()
参数是promise实例数组
任一实例完成时执行then,该实例成功就执行then、失败执行catch
5、reject( reason )
参数是失败原因
返回一个失败的promise对象实例
let p4 = Promise.reject('失败的原因')
console.log(p4);
6、resolve( any )
①. 参数是promise实例
结果:直接返回这个实例
②. 参数是一个具有then方法的对象
结果:将这个对象转为Promise对象,并立即执行对象的then方法
let thenable = {
then:()=> {
console.log(909);
}
}
let thenable2 = {
then: (resolve, reject) => {
resolve(99)
}
}
Promise.resolve(thenable); // 909
Promise.resolve(thenable2).then((res) => {
console.log(res); // 99
})
③. 参数是没有then方法的对象或者参数不是对象
结果:返回一个状态为resolved的Promise对象,并将参数传入下一个then
let htneable = {
a: 1
}
Promise.resolve(htneable).then((res) => {
console.log(res); // {a:1}
})
④. 不带任何参数
结果:返回状态为resolved的Promise对象。
通常用来直接执行then方法内容
Promise.resolve().then(() => {
console.log(111);
})