关于javascript:手写Promise14promise中then方法的链式调用

5次阅读

共计 1636 个字符,预计需要花费 5 分钟才能阅读完成。

promise还有一个很重要的特点,
then办法能够被链式调用,前面一个 then 办法失去的值是上一个 then 办法的返回值

实现这个性能,须要两个步骤,第一是实现 then 办法的链式调用,第二是把上一个 then 办法回调函数返回值传递给下一个 then 办法。

then办法属于 promise 一个属性,而且 then 办法执行后返回一个 promise 对象,那么能够在 then 办法中 new 一个 promise 对象,并且返回,这样就能够始终执行 then 办法。而 promise 的构造函数接管一个执行器,并且要立刻执行,那么将原有的 then 办法中的代码放入到执行器中就能够实现这个要求。

而在执行器中的代码逻辑也须要批改,胜利和失败状态中都须要判断返回值类型,如果是一般值,就能够立刻执行,传递给下一个 promise 对象,如果是 promise 对象,须要查看他的状态,并传递给下一个 promise 对象。

解决返回值类型专用办法

function resolvePromise(e, resolve, reject) {if (e instanceof MyPromise) {
        // promise 对象
        // e.then((value) => {//     resolve(value)
        // }, (reason) => {//     reject(reason)
        // })
        // 简化代码
        e.then(resolve, reject);
    } else {
        // 一般值
        resolve(e);
    }
}

then办法批改

    then(successCallback, failedCallback) {let promise2 = new Promise((resolve, reject) => {
            // 状态判断
            if (this.status === FULFILLED) {
                // 定义胜利回调返回值,传给下一个 then 的胜利回调
                let successRtn = successCallback(this.value);
                // 判断 successRtn 的值是一般值还是 promise 对象
                // 如果是一般值,间接调用 resolve 
                // 如果是 promise 对象,查看 promsie 对象返回的后果 
                // 再依据 promise 对象返回的后果,决定调用 resolve 还是调用 reject
                // 执行 resolve 办法,相当于把返回值传递给下一个 then 的胜利回调函数
                resolvePromise(successRtn, resolve, reject);
            } else if (this.status === REJECTED) {let failedRtn = failedCallback(this.reason);
                resolvePromise(failedRtn, resolve, reject);
            } else {
                // 期待,须要将胜利回调和失败回调存储起来,期待须要执行的时候才执行
                this.successCallback.push(successCallback);
                this.failedCallback.push(failedCallback);
            }
        });
        return promise2;
    }

测试代码

let promise = new MyPromise((resolve, reject) => {resolve('---success----');
    // setTimeout(()=>{//     resolve('success')
    // },3000)
    // reject("---failed----");
})

function other() {return new MyPromise((resolve, reject) => {resolve("a  promise object")
    })
}
promise.then(value => {console.log(value);
    return other();}, reason => {console.log(reason)
}).then(value => {console.log(value)
})

测试打印

---success----
a  promise object

阐明逻辑批改胜利

正文完
 0