不积跬步之手撕Promise(前)标注一下Promise的关键点,这篇是手撕源码的前篇. 介绍了Promise相关的特性

如果要手撕源码，就必须要知道我们实现哪些功能细节，下面就是梳理一下：

1.如何修改对象的状态

有三种方式

let p = new Promise((resolve,reject)=>{
    //1.调用resolve 函数
    //resolve("ok")// pedding => fulfilled
    //2.调用 reject函数
    //reject("error")
    //3.抛出错误
    throw new Error("");
})

2.一个`promise`指定多个成功/失败回调函数,都会调用吗?

当Promise改变为对应的状态时都会调用,也就是说,如果状态不改变,则都不会调用

let p1 = new Promise((resolve,reject)=>{
    resolve("0");
})

p1.then(value=>{
    console.log(value);
})

p1.then(value=>{
    console.log(value);
})

//0
//0

都会执行

3.改变promise状态和指定回调谁先谁后 ?

都有可能,正常情况下指定回调再改变状态,但也可以先改变状态再指定回调

如何先改变状态再指定回调 ?

在执行器中直接调用resolve/reject,同步任务的时候,

let p = new Promise((resolve,reject)=>{
    resolve("Ok"); //同步执行
})

p.then(value=>{
    console.log(value)
},reason=>{
    console.log(reason)
})

如果想反过来就异步调用,这种情况也是我们正常用到的

let p = new Promise((resolve,reject)=>{
    setTimeout(()=>{
        resolve("OK");
    },1000)
})

p.then(value=>{
    console.log(value)
},reason=>{
    console.log(reason)
})

延迟更长时间才调用then() 这个就是在调用then的时候加个setTimeout,来让它延迟调用

什么时候才能得到数据?

如果先指定回调,那当状态发生改变时,回调函数就会调用,得到数据
如果先改变状态,那当指定回调时,回调函数就会调用,得到数据

4.promise.then()返回的新的promise的结果状态由什么决定的?

简单来说:由then()指定的回调函数执行的结果决定可以分为如下几种情况:

如果抛出异常,新promise变为rejected,reason为抛出的异常
如果返回的是非promise的任意值,新promise变为resolved,value是返回的值
如果返回的是另一个promise,此promise的结果就会成为新promise的结果

let p = new Promise((resolve,reject)=>{
    setTimeout(()=>{
        resolve("OK");
    },1000)
})

let result = p.then(value=>{
    //console.log(value)
    //1.抛出错误
    //throw "出了问题"
    //2.返回结果是非Promise类型的对象
    //return 521  结果是fulfilled,value是521
    //3.返回结果是 Promise对象 则由promise对象的结果决定
    return new Promise((resolve,reject)=>{
        resolve("success")
    })
},reason=>{
    console.log(reason)
})

5.promise如何串联多个操作任务?

promise的then()返回一个新的promise,可以开成then()的链式调用
通过then的链式调用串联多个同步/异步任务

6.promise异常穿透 ?

1.当使用Promise的then 链式调用时,可以在最后指定失败的回调 2.前面任何操作出了异常,都会传到最后失败的回调中处理

let p = new Promise((resolve,reject)=>{
    setTimeout(()=>{
        // resolve("OK");
        reject("error");
    },1000)
})

p.then(value=>{
    console.log(111)
}).then(value=>{
    console.log(222)
}).then(value=>{
    console.log(333)
}).catch(reason => {
    console.log(reason)
})

层层穿透 ,直达最后

7.中断promise链?

怎么当使用promise的then链式调用时,不再调用后面的回调函数?

办法:在回调函数中返回一个pedding状态的Promise对象.

let p = new Promise((resolve,reject)=>{
    setTimeout(()=>{
         resolve("OK");
        //reject("error");
    },1000)
})

p.then(value=>{
    console.log(111)
}).then(value=>{
   return new Promise(()=>{});
}).then(value=>{
    console.log(333)
}).catch(reason => {
    console.log(reason)
})

骚气,为什么通过返回一个pedding状态的promise可以中断链式调用呢?

那是因为链式调用的前提是promise必须是fulfilled或者是rejected 两个中的一个,才会触发后面的回调.

如果不是当然不能了.

不积跬步之手撕Promise(前)