1. 图示
思维导图链接 https://www.zhixi.com/view/23ff2291
2. 使用promise原因
在没有promise的时候,一直使用setTimeout函数,这样就会造成回调地狱。
3. 基本状态
promise 有三种状态
- pending(此时 promise还没有调用完成)
- fulfilled(promise 调用完成,状态是成功了)
- rejected(promise 调用完成,状态是失败了)
Promise 状态一旦从pending转换为fulfilled或者rejected, 那么状态将不会再次改变
4. 类上的常用方法
Promise 类上方法也是经常使用的
- Promise.resolve()
传入值 | 返回值 |
---|---|
传入一个promise res值 | 返回res, 直接promise 结果值 |
传入一个promise rej 值 | 返回为rej类型, 直接promise 结果值 |
传入一个基本类型值 | 返回res类型, 直接获取值 |
结论 resolve 传入rej 类型时,返回也是rej。但是无论传入什么都被解析为最终结果
- Promise.reject()
传入值 | 返回值 |
---|---|
传入一个promise res值 | 直接是rej ,直接返回promise |
传入一个promise rej 值 | 直接是rej, 直接返回promise |
传入一个基本类型值 | 返回res类型, 直接获取值 |
结论 reject 传入什么都是rej,且返回值就是传入值
-
Promise.all()
传入一个promise数组(如果是基本类型直接就是 res类型的Promise), 等待所有的promise 完毕,但是有一个promise为rej 就直接返回 失败结果, 不再等待全部执行完毕。
-
Promise.race()
是 Promise.race 只要传入的 Promise 对象,有一个状态变化了(无论对错),就会立即结束,而不会等待其他 Promise 对象返回。
-
Promise.allSettled()
传入一个promise数组(如果是基本类型直接就是 res类型的Promise), 无论是正确还是错误,最后整合为一个数组,全部返回。返回的值代表每个promise的状态和结果,错误的就是 错误状态和错误信息。
5. 原型链式调用返回值
- then resolve返回, then reject 返回, catch 返回 三者 return 后是一样的
三者一样
1.传入一个promise res值 返回res类型, 直接promise 结果值
2.传入一个promise rej 值 直接是rej, 直接promise 结果值
3.传入一个基本类型值 返回res类型, 直接获取值
- finally 返回
不管promise最后的状态,在执行完then或catch指定的回调函数以后,都会执行finally方法指定的回调函数。
finally 是没有return (返回值的),且不对当前一次的返回值造成影响。且finally 是没有任何传参的。
6.(then 里面的 reject) 和 catch 的区别
1.catch 方法可以捕获到 catch 之前整条 promise 链路上所有抛出的异常。
2.then 方法的第二个参数捕获的异常依赖于上一个 Promise 对象的执行结果。
如果是promise内部报错 reject 抛出错误后,then 的第二个参数就能捕获得到,如果then的第二个参数不存在,则catch方法会捕获到。
如果是then的第一个参数函数 resolve 中抛出了异常,即成功回调函数出现异常后,then的第二个参数reject 捕获捕获不到,catch方法可以捕获到。
7. async await 合并使用
1.await 同一行后面的内容对应 Promise 主体内容,即同步执行的
2.( 重点) await 下一行的内容对应 then()里面的内容,是异步执行的,
其实也是await这行执行的相当于then方法。对await右边的值进行返回
示例:
async function asyncFun() {
console.log('async1 start');
await 111;
console.log('async1 inner');
}
asyncFun();
console.log('script end');
3.await 同一行后面应该跟着一个 Promise 对象,如果不是,需要转换(如果是常量会自动转换)
4.async 函数的返回值还是一个 Promise 对象
8. 使用try catch 的注意事项
try catch 是传统的异常捕获方式,这里只能捕获同步代码的异常,并不能捕获异步异常,因此无法对 Promise 进行完整的异常捕获。
总结,看道题
function promise2() {
return new Promise((resolve) => {
console.log('promise2 start');
resolve();
})
}
function promise3() {
return new Promise((resolve) => {
console.log('promise3 start');
resolve();
})
}
function promise4() {
return new Promise((resolve) => {
console.log('promise4 start');
resolve();
}).then(() => {
console.log('promise4 end');
})
}
async function asyncFun() {
console.log('async1 start');
await promise2();
console.log('async1 inner');
await promise3();
console.log('async1 end');
}
setTimeout(() => {
console.log('setTimeout start');
promise1();
console.log('setTimeout end');
}, 0);
asyncFun();
promise4();
console.log('script end');