从零手写Promise：深度解析Promise/A+规范实现原理

一、Promise/A+规范核心要点

Promise/A+规范是社区对Promise行为的标准化定义，包含三个核心组成部分：

1. 状态机制：Promise必须处于pending、fulfilled或rejected三种状态之一
2. Then方法规范：定义了then方法的参数处理、链式调用和值穿透规则
3. 异步保证：要求状态变更和then回调执行必须异步进行

规范通过8个章节、30余条细则精确描述了Promise的行为边界，例如2.2.7条款明确规定：”onFulfilled或onRejected必须被作为函数调用”，这直接影响了实现时的调用方式处理。

二、基础Promise类架构设计

1. 构造函数实现

class MyPromise {
  constructor(executor) {
    this.state = 'pending'; // 初始状态
    this.value = undefined; // 成功值
    this.reason = undefined; // 失败原因
    this.onFulfilledCallbacks = []; // 成功回调队列
    this.onRejectedCallbacks = []; // 失败回调队列
    const resolve = (value) => {
      if (this.state === 'pending') {
        this.state = 'fulfilled';
        this.value = value;
        this.onFulfilledCallbacks.forEach(fn => fn());
      }
    };
    const reject = (reason) => {
      if (this.state === 'pending') {
        this.state = 'rejected';
        this.reason = reason;
        this.onRejectedCallbacks.forEach(fn => fn());
      }
    };
    try {
      executor(resolve, reject);
    } catch (err) {
      reject(err);
    }
  }
}

关键设计点：

• 状态不可逆性：一旦状态从pending变更，后续resolve/reject调用无效
• 异步执行队列：使用数组存储回调，在状态变更时批量执行
• 错误捕获机制：在executor执行时添加try-catch保护

2. Then方法实现

then(onFulfilled, onRejected) {
  // 参数默认值处理（规范2.2.1）
  onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : value => value;
  onRejected = typeof onRejected === 'function' ? onRejected : reason => { throw reason; };
  const promise2 = new MyPromise((resolve, reject) => {
    if (this.state === 'fulfilled') {
      setTimeout(() => {
        try {
          const x = onFulfilled(this.value);
          resolvePromise(promise2, x, resolve, reject);
        } catch (e) {
          reject(e);
        }
      }, 0);
    } else if (this.state === 'rejected') {
      setTimeout(() => {
        try {
          const x = onRejected(this.reason);
          resolvePromise(promise2, x, resolve, reject);
        } catch (e) {
          reject(e);
        }
      }, 0);
    } else if (this.state === 'pending') {
      this.onFulfilledCallbacks.push(() => {
        setTimeout(() => {
          try {
            const x = onFulfilled(this.value);
            resolvePromise(promise2, x, resolve, reject);
          } catch (e) {
            reject(e);
          }
        }, 0);
      });
      this.onRejectedCallbacks.push(() => {
        setTimeout(() => {
          try {
            const x = onRejected(this.reason);
            resolvePromise(promise2, x, resolve, reject);
          } catch (e) {
            reject(e);
          }
        }, 0);
      });
    }
  });
  return promise2;
}

实现要点：

• 异步执行保证：使用setTimeout将回调推入任务队列
• 参数默认处理：遵循规范2.2.1的默认函数定义
• 链式调用支持：每次then返回新Promise对象

三、核心算法：resolvePromise实现

function resolvePromise(promise2, x, resolve, reject) {
  // 规范2.3.1：禁止循环引用
  if (promise2 === x) {
    return reject(new TypeError('Chaining cycle detected for promise'));
  }
  let called = false; // 规范2.3.3.3.3：防止多次调用
  // 规范2.3.2：x为对象或函数时的处理
  if ((typeof x === 'object' && x !== null) || typeof x === 'function') {
    try {
      const then = x.then;
      if (typeof then === 'function') {
        // 规范2.3.3：处理thenable对象
        then.call(
          x,
          y => {
            if (called) return;
            called = true;
            resolvePromise(promise2, y, resolve, reject);
          },
          r => {
            if (called) return;
            called = true;
            reject(r);
          }
        );
      } else {
        resolve(x);
      }
    } catch (e) {
      if (called) return;
      called = true;
      reject(e);
    }
  } else {
    // 规范2.3.4：x为原始值时的处理
    resolve(x);
  }
}

算法解析：

1. 循环引用检测：防止Promise对象自我引用导致的无限递归
2. Thenable处理：对具有then方法的对象进行特殊处理
3. 值穿透机制：当x为非对象/函数时直接resolve
4. 调用状态锁：通过called标志防止多次resolve/reject

四、扩展方法实现

1. Catch方法实现

catch(onRejected) {
  return this.then(null, onRejected);
}

2. Resolve静态方法

static resolve(value) {
  if (value instanceof MyPromise) {
    return value;
  }
  return new MyPromise(resolve => resolve(value));
}

3. Reject静态方法

static reject(reason) {
  return new MyPromise((_, reject) => reject(reason));
}

4. All方法实现

static all(promises) {
  return new MyPromise((resolve, reject) => {
    const results = [];
    let completed = 0;
    if (promises.length === 0) {
      resolve(results);
      return;
    }
    promises.forEach((promise, index) => {
      MyPromise.resolve(promise).then(
        value => {
          results[index] = value;
          completed++;
          if (completed === promises.length) {
            resolve(results);
          }
        },
        reason => reject(reason)
      );
    });
  });
}

五、规范验证与测试策略

1. 测试用例设计

1. 状态变更测试：

   • 验证pending→fulfilled的单向变更
   • 验证重复resolve/reject的无效果

2. 链式调用测试：

   • 测试连续then调用的值传递
   • 验证异常在链中的传播

3. 异步行为测试：

   • 使用setTimeout验证回调的异步执行
   • 测试微任务与宏任务的执行顺序

2. 规范符合性验证

推荐使用promises-aplus-tests进行自动化验证，该测试套件包含270+个测试用例，覆盖规范的所有条款。

六、实际应用中的优化建议

1. 性能优化：

   • 使用对象池管理Promise实例
   • 对频繁创建的Promise进行缓存

2. 调试支持：

   • 添加Promise链跟踪功能
   • 实现自定义的stack trace收集

3. 兼容性处理：

   • 添加Symbol.species支持
   • 处理旧版浏览器的兼容问题

七、完整实现代码

class MyPromise {
  // ... 前文实现代码 ...
}
// 添加Promise/A+规范要求的default方法
MyPromise.defer = MyPromise.deferred = function() {
  const dfd = {};
  dfd.promise = new MyPromise((resolve, reject) => {
    dfd.resolve = resolve;
    dfd.reject = reject;
  });
  return dfd;
};
module.exports = MyPromise;

八、总结与展望

通过实现Promise/A+规范，我们深入理解了异步编程的核心机制。这种实现不仅有助于更好地使用原生Promise，也为理解Async/Await等高级特性打下了基础。在实际开发中，建议：

1. 优先使用原生Promise，其经过充分优化和测试
2. 在需要特殊功能时（如取消Promise），可基于规范进行扩展
3. 保持对ES规范更新的关注，及时调整实现策略

未来异步编程的发展方向可能包括：

• 更精细的取消机制标准化
• 并发控制原语的完善
• 与其他异步模型（如Observables）的融合

这种从底层实现规范的过程，能够显著提升开发者对JavaScript异步编程的理解深度，为解决复杂异步场景问题提供有力支持。