手写 Promise 的实现

什么是 Promise

Promise 是一个类。

当通过new Promise创建一个实例时，需要传入一个回调函数，我们称之为 executor。

• 这个回调函数会被立即执行，并传入两个回调函数的参数 (resolve, reject)。
• 当调用 resolve 回调函数时，会执行 Promise 对象的 then 方法传入的回调。
• 当调用 reject 回调函数时，会执行 Promise 对象的 catch 方法传入的回调。

Promise 是一个状态机制，它有3种状态：

• pending：待定状态，执行 executor 后，处于这个状态。
• fulfilled：兑现状态，调用 resolve() 后，Promise 的状态更改为 fulfilled，并且无法再次更改。
• rejected：拒绝状态，调用 reject() 后，Promise 的状态更改为 rejected，并且无法再次更改。

手写一个 Promise 编程

// Promise的三种的状态
const STATUS_PENGINDING = 'pending';  // 待定状态
const STATUS_FULFILLED = 'fulfilled'; // 兑现状态
const STATUS_REJECTED = 'rejected';   // 拒绝状态

// 定义一个Promise的类
class newPromise {
  constructor(executor = () => { }) {
    // 执行构造函数，并把状态值设置为pending
    this.state = STATUS_PENGINDING; // 初始状态
    this.value = null;  // 成功的返回值
    this.reason = null; // 失败的返回值

    // resolve 需要接收一个参数
    const resolve = (value) => {
      // 防止重复执行，表示状态不可逆
      // 只有状态是 pending 时，才会改变执行改变状态
      // 执行 resolve 后，状态值变成 fulfilled
      if (this.state === STATUS_PENGINDING) {
        this.state = STATUS_FULFILLED;
        this.value = value;
      }
    }

    // reject 需要接收一个参数
    const reject = (reason) => {
      // 防止重复执行，表示状态不可逆
      // 只有状态是 pending 时，才会改变执行改变状态
      // 执行 reject 后，状态值变成 rejected
      if (this.state === STATUS_PENGINDING) {
        this.state = STATUS_REJECTED;
        this.reason = reason;
      }
    }

    // 传入的回调会返回两个参数 resolve 和 reject
    executor(resolve, reject);
  }

  // then接收两个回调，分别用于处理成功和失败
  then(onFulfilled, onRejected) {
    // 穿透就是没有方法，则给一个默认的方法，将值传下去
    if (onFulfilled && typeof onFulfilled === 'function') {
      onFulfilled(this.value);
    }
    if (onRejected && typeof onRejected === 'function') {
      onRejected(this.reason);
    }
  }
}

// 执行上面定义的方法
new newPromise((resolve, reject) => {
  // 这两个状态只能二选一
  // resolve('成功返回值');
  reject('失败返回值');
}).then(
  res => {
    console.log('成功的', res);
  },
  err => {
    console.log('失败的', err);
  }
);