[源码]手写Promise

Promise A+规范: https://promisesaplus.com/

promise功能罗列

阅读Promise A+规范后,罗列下大致需要实现的功能


 1. excutor在构造函数执行时执行
 2. -----------Promise State--------------------------
 3. Promise只能是pending\fulfilled\rejected三种状态之一
 4. 处于pending的Promise接下来只会变成fulfilled或者rejected
 5. 处于fulfilled的Promise状态再也不能改变了,且拥有一个引用不能改变的值value
 6. 处于rejected的Promise状态也再不能改变,且拥有一个引用不能改变的失败原因reason
 7. ---------------------------------------------------
 8. -----------then()方法-------------------------------
 9. Promise要提供then方法来接受当前或者最终的value和reason
 10.then方法接受两个参数 new Promise().then(onFulfilled, onRejected)
 11.onFulfilled和onRejected这两个参数是非必选的,如果他们不是Function类型,则会被忽略(catch可以利用这一条来实现)
 10. 参数onFulFilled函数用value作为第一个参数,当且仅当Promise的状态变为fulfilled后执行,最多执行一次
 11. 参数onRejected函数用reason作为第一个参数,当且仅当Promise的状态变为rejected后执行,最多执行一次
 12. onFulfilled or onRejected must not be called until the execution context stack contains only platform code. [3.1].
 13. then可以被多次调用then may be called multiple times on the same promise.
If/when promise is fulfilled, all respective onFulfilled callbacks must execute in the order of their originating calls to then.
If/when promise is rejected, all respective onRejected callbacks must execute in the order of their originating calls to then.
14.then must return a promise [3.3].

 “promise2 = promise1.then(onFulfilled, onRejected);“
 
If either onFulfilled or onRejected returns a value x, run the Promise Resolution Procedure [[Resolve]](promise2, x).
If either onFulfilled or onRejected throws an exception e, promise2 must be rejected with e as the reason.
If onFulfilled is not a function and promise1 is fulfilled, promise2 must be fulfilled with the same value as promise1.
If onRejected is not a function and promise1 is rejected, promise2 must be rejected with the same reason as promise1.

除此之外,还有一部分The Promise Resolution Procedure

除彼之外,还有then的链式调用,简单精炼的概括下Promise的then链式调用的特点:
catch就是then、
成功:返回legal js value,返回成功态的Promise
失败:抛异常,返回失败态的Promise

代码实现

先实现下上面已经罗列出来的功能,后续功能在之后陆续补充完善

自定义_Promise类 (有几点注意,用箭头函数规避this指向问题;resovle和reject属于对象范畴,故不把他们放在Prototype上)

// _Promise.js

const PENDING = "pending", FULFILLED = "fulfilled", REJECTED = "rejected";

class _Promise {
  constructor(excutor) {
    this.status = PENDING;
    this.value = undefined;
    this.reason = undefined;

    const resovle = value => {
        if(this.status === PENDING) {
            this.status = FULFILLED;
            this.value = value;
        }
    }

    const reject = reason => {
        if(this.status === PENDING) {
            this.status = REJECTED;
            this.reason = reason;
        }
    }

    try{
        excutor(resovle, reject);
    }catch(e){
        reject(e);
    }
    
  }

  then(onFulFilled, onRejected) {
      if(this.status === FULFILLED){
          onFulFilled(this.value);
      }

      if(this.status === REJECTED){
          onRejected(this.reason);
      }
  }
}

module.exports = _Promise;

测试程序

const _Promise = require("./MyPromise");

let promise  = new _Promise((resovle, reject) => {
    // resovle("success");
    // reject("failed");
    throw new Error("ERRORRRR");
});

promise.then(value => console.log(value), reason => console.log(reason));

后续将补充then的链式调用,发布订阅模式.

你可能感兴趣的:([源码]手写Promise)