Promise执行操作

最新推荐文章于 2023-03-06 10:31:58 发布

xx_115

最新推荐文章于 2023-03-06 10:31:58 发布

阅读量413

点赞数 1

分类专栏： vue基础文章标签： vue.js

本文链接：https://blog.csdn.net/h118264/article/details/116722000

版权

5 篇文章 0 订阅

订阅专栏

本文详细介绍了JavaScript中的Promise对象，包括其构造函数、resolve和reject方法、then及catch方法的使用方式和内部逻辑。解释了Promise对象的三种状态及其转换规则。

摘要由CSDN通过智能技术生成

Promise

构造函数

const p = new Promise((resolve, reject) => {
    // ...
})

resolve(1)（实参可选）用来将新建的Promise对象（p）的状态变为已完成（fulfilled），并将1作为成功的值（value）
reject(2)（实参可选）用来将新建的Promise对象（p）的状态变为已失败（rejected），并将2作为失败的原因（reason）
如果既不调用resolve，也不调用reject，那么新建的Promise对象一直处于进行中（pending）状态
注意：Promise对象只有三种状态，且只能由pending变为fulfilled或者rejected，且一旦改变就不能再变
- 已完成（fulfilled）
- 已失败（rejected）
- 进行中（pending）

Promise.prototype.then

const p2 = p.then((value) => {
    // ...
}, (reason) => {
    // ...
})

then方法用来指定p的已完成（第一个参数）和已失败（第二个参数）的回调函数
- 这两个参数都是可选的，then方法内部会做默认值处理
  - 成功回调默认值：value => value
  - 失败回调默认值：(reason) => { throw reason }
- 当p的状态变为fulfilled时，将成功的回调推入微任务队列
- 当p的状态变为rejected时，将失败的回调推入微任务队列
- 当p的状态为pending时，成功和失败的回调会暂存到内存中，等待p的状态改变再推入到相应的微任务队列
then方法的返回值是一个新的Promise对象（p2）
p2的状态由p的回调函数（成功或失败）的执行逻辑决定
- 如果回调函数执行过程中抛出异常，则p2的状态改变为rejected
- 如果回调函数返回值为一个非Promise对象，则p2的状态改变为fulfilled，该返回值会作为p2的value
- 如果回调函数返回值为一个Promise对象（暂且叫p3），则p2的状态会由p3的回调函数执行逻辑决定（等待p3的状态改变后再变）

Promise.prototype.catch

p2.catch((reason) => {
    // ...
})

catch方法内部会转而调用then方法，并将then方法的返回值作为自己的返回值，相当于：
Promise.prototype.catch = function (onRejected) {
return this.then(undefined, onRejected)
}
补充说明：所以catch方法的其余逻辑同上then方法