导航

Promise 一些注意点

Posted on 2022-02-11 16:56  小白*代码  阅读(123)  评论(0)    收藏  举报

Promise是一个构造函数,其身上有all、race、resolve、reject这些方法,都可以通过 Promise. 调用。

注意点1

Promise构造函数接受一个参数 => function,其中 function接受两个参数

resolve:表示从padding => resolve 成功

reject: 表示从padding => reject 失败

其状态不可逆

注意点2

在执行 all 或者 race 方法时:

all:语法 Promise.all([p1, p2, p3, ...]).then().catch()

只有p1、p2、p3 都成功才进入then,否则进入catch。虽然进入catch但是p1、p2、p3所对应的方法都还会继续执行

也就是说:p1最先执行完,但是有错误,此时进入了all的catch。但是此时p2、p3对应的函数还会执行,并不会停止

race:语法 Promise.race([p1, p2, p3, ...]).then().catch()

和all一样,唯一不同的是:p1、p2、p3 有一个成功,就算成功,进入then

注意点3:关于return的用法(什么时候加什么时候不加)

当Promise.then(onFulfilled, onRejected) 接收两个参数,一个是状态变为resolve后的回调函数,一个是状态变为reject后的回调函数(此处只讨论onFulfilled)

1、如果onFulfilled是一个函数,且有返回值,则返回值可以继续传递给后续的then

2、如果onFulfilled是一个函数,但没有返回值(相当于return undefined),则后续then中的入参为undefined

3、如果onFulfilled不是函数,则忽略当前then,将参数直接传递给后续的then

看如下代码

 

 

 在函数aa中不用return,但是在函数bb需要return。否则在下边的msg 和 p 打印结果取不到。

其原因:和上边所说一样,then 接受是一个函数,且需要返回值,所以需要return

而在函数aa中不需要return的原因是:通过new Promise(resolve, reject) 中的resolve方法返回相当于自动将返回值,挂在了promise中

而在函数bb中,通过构造函数Promise下的resolve方法是没有挂在到当前的promise中,所以当调用then的时候拿不到返回值,因此这里需要自己手动return.

另外:

1、不管是函数aa还是函数bb最外层的return是为了拿到函数返回值,和promise没有关系

2、如果在函数aa的promise中也加了return,只是为了阻止代码继续向下执行而已,和取值没有关系,如下代码,return的作用只是为了不让console.log(111) 执行

function aa () {
   return new Promise((resolve, reject) => {
       setTimeout(() => {
            return resolve({"msg": "aa"})
            console.log(111)
        }, 1000);
    })
}
                        

记住一点:通过new Promise(resolve,reject)的方式,当调用then去值的话不用加return,如果通过Promise.resolve获取的话,当调用then去值的话需要加return