Promise原理以及方法
文章类型:Javascript
发布者:hp
发布时间:2023-02-27
一原理:
Promise 是 ES6 新增的语法,解决了回调地狱的问题
简单来说它就是一个容器,里面保存着某个未来才会结束的事件(通常是异步操作)的结果
从语法上说,Promise 是一个对象,从它可以获取异步操作的消息,状态不可逆
状态:
1:待定(pending):初始状态,既没有被完成,也没有被拒绝。
2:已完成(fulfilled):操作成功完成。
3:已拒绝(rejected):操作失败。
结果:
1:resolve函数
2:reject函数
回调:
1:then() 可以接受参数,一个参数为成功的回调,另一个参数为失败的回调
a:返回返回一个普通值 状态:fulfilled
promise.then(res => ({name:'ice', age:22}))
.then(res => console.log(res))
//{name:'ice', age:22}
b:明确返回一个promise
promise.then(res => { return new Promise((resolve, reject) => { resolve('then 的返回值') }) }).then(res => console.log(res))
//{name:'ice', age:22}
c:返回一个thenable对象 状态:fulfilled
promise.then(res => {
return {
then(resolve, reject) {
resolve('hi webice')
}
}
}).then(res => console.log(res))
//hi webice
2:catch() 有返回值的,它的返回值是promise
a:返回一个普通对象
promise.catch(err => ({name:'ice', age: 22})).then(res => console.log(res))
//{name:'ice', age: 22}
b:明确返回一个promise
promise.catch(err => { return new Promise((resolve, reject) => { reject('ice error promise') }) }).catch(res => console.log(res))
c:返回thenable对象
promise.catch(err => { return { then(resolve, reject) { reject('ice error then') } } }).catch(res => console.log(res))
3:finally() 状态是fulfilled还是rejected都会执行一次finally方法
const promise = new Promise((resolve, reject) => {
resolve('hi ice')
})
promise.then(res => console.log(res)).finally(() => console.log('finally execute'))
二:方法
1:all 当所有结果成功返回时按照请求顺序返回成功结果,或者其中有一个失败方法时,则进入失败方法
Promise.all([a(),b(),c()])
2:any 只要有一个变成 fulfilled状态,返回变成 fulfilled 状态;如果所有参数 Promise 实例都变成 rejected 状态,实例就会变成 rejected 状态
const anyPromise = Promise.any([resolved, rejected]);
anyPromise.then(function (results) {
console.log(results);
});
3:race 有一个实例率先改变状态,则 race 方法的返回状态就跟着改变
Promise.race([a(), b()])
.then(function(results){
console.log(results);
})
.catch(function(reason){
console.log(reason);
});
4:allSettled 全部处理完成后,我们可以拿到每个 Promise 的状态,不管是否处理成功
const allSettledPromise = Promise.allSettled([resolved, rejected]);
allSettledPromise.then(function (results) {
console.log(results);
});