天天看点

按照 Promise/A+ 手写Promise,通过promises-aplus-tests的全部872个测试用例

本文主要讲述如何根据 Promises/A+ 规范,一步步手写一个 Promise 的 polyfill,代码中会配上对应的规范解释。

Promsie 构造函数内部,主要做 5 件事儿:

Promise 的决议逻辑是 Promise 的一大重点,也是一大难点,把这个逻辑搞清楚了,手写 Promise 就成功一半了。Promise 的决议函数 resolutionProcedure 接收 2 个参数,第一个参数是需要决议的promise实例,第二个参数是决议值,即调用resolve(x)的时候传进去的参数x。Promise 的决议程序主要做了 4 件事:

判断 x 和 promise 是否指向同一个对象;

判断 x 是否是一个 promise 实例;

判断是否是 thenable;

x 为其他 js 基础值,且未决议,则直接决议;

至此,Promise 构造函数就算完成了,接下来我们来看 Promise 的另一个重头戏:then。

为什么把 then 单独从原型方法中拎出来,主要还是因为他是除了 Promise 决议逻辑之外的另一个重难点,所以想单独讲解。

从大的方面来说,then方法中主要做了 2 件事:

处理 onFulfilled 或者 onRejected 不是函数的情况;

创建并返回一个新的 promise 实例;

2.1 包装 onFulfilled 和 onRejected 为异步函数

2.2 判断当前的 promise 状态,决定如何处理传入的回到函数:

2.2.1 若为 fulfilled,则执行 onFulfilled;

2.2.2 若为 rejected,则执行 onRejected;

2.2.3 如果 promise 未决议,则将回调保存在 onFulfilledCallbacks 和 onRejectedCallbacks 中,待 promise 决议之后再执行对应回调;

至此,手写一个 Promise 就算完成了,此 Promise 完全按照 Promise/A+ 的要求写的,也全部通过了promises-aplus-tests的 872 个测试用例。如果您还发现有什么欠缺的地方,欢迎指正;如果觉得对您有用,也请点个赞哦。