一、Promise的核心机制解析

Promise作为现代JavaScript异步编程的核心工具，其设计解决了回调地狱（Callback Hell）问题，通过状态机管理和链式调用机制实现了更可控的异步流程。根据ECMAScript规范，Promise存在三种状态：pending（初始态）、fulfilled（成功态）和rejected（失败态）。状态一旦改变便不可逆，这一特性保证了异步操作的确定性。

1.1 状态机的实现原理

状态管理是Promise的核心。手写实现时需定义三个私有属性：

class MyPromise {
  constructor(executor) {
    this.state = 'pending'; // 初始状态
    this.value = undefined; // 成功值
    this.reason = undefined; // 失败原因
    this.callbacks = []; // 存储then方法的回调
  }
}

状态转换逻辑需严格遵循规范：

• pending → fulfilled：调用resolve(value)时触发
• pending → rejected：调用reject(reason)或执行器抛出异常时触发

1.2 执行器与异步任务封装

执行器（executor）是Promise构造时传入的函数，接收resolve和reject两个参数。手写实现需处理同步和异步两种场景：

constructor(executor) {
  try {
    executor(
      value => this.resolve(value),
      reason => this.reject(reason)
    );
  } catch (err) {
    this.reject(err); // 捕获执行器同步错误
  }
}

对于异步操作（如setTimeout、fetch），需在回调中调用resolve/reject。

二、then方法的链式调用实现

then方法是Promise的核心API，其设计需满足三个关键特性：

1. 返回值穿透：若onFulfilled返回非Promise值，则直接作为下一个then的输入
2. Promise链解包：若返回Promise，则等待其决议后传递结果
3. 异常传播：未捕获的异常会沿链向下传递

2.1 then方法的基础结构

then(onFulfilled, onRejected) {
  // 参数默认值处理（符合Promise/A+规范）
  onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : v => v;
  onRejected = typeof onRejected === 'function' ? onRejected : err => { throw err; };
  const promise2 = new MyPromise((resolve, reject) => {
    // 处理状态已决议的情况
    if (this.state === 'fulfilled') {
      setTimeout(() => {
        try {
          const x = onFulfilled(this.value);
          resolvePromise(promise2, x, resolve, reject);
        } catch (err) {
          reject(err);
        }
      }, 0);
    } else if (this.state === 'rejected') {
      // 类似处理rejected状态
    } else {
      // pending状态时存储回调
      this.callbacks.push({
        onFulfilled: value => {
          // 同上处理
        },
        onRejected: reason => {
          // 同上处理
        }
      });
    }
  });
  return promise2;
}

2.2 返回值解析协议（Promise Resolution Procedure）

关键在于resolvePromise函数的实现，需处理三种情况：

1. 返回普通值：直接resolve
2. 返回自身Promise：抛出TypeError（防止循环引用）

3. 返回其他Promise：等待其决议

   function resolvePromise(promise2, x, resolve, reject) {
   if (promise2 === x) return reject(new TypeError('Chaining cycle'));
   let called = false;
   if (x instanceof MyPromise) {
    x.then(
      y => resolvePromise(promise2, y, resolve, reject),
      reject
    );
   } else if (x !== null && (typeof x === 'object' || typeof x === 'function')) {
    try {
      const then = x.then;
      if (typeof then === 'function') {
        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 (err) {
      if (called) return;
      called = true;
      reject(err);
    }
   } else {
    resolve(x);
   }
   }

三、静态方法与实例方法扩展

3.1 Promise.resolve/reject的快速封装

static resolve(value) {
  if (value instanceof MyPromise) return value;
  return new MyPromise(resolve => resolve(value));
}
static reject(reason) {
  return new MyPromise((_, reject) => reject(reason));
}

3.2 Promise.all的实现要点

需处理两种场景：

1. 所有Promise成功：返回结果数组

2. 任一Promise失败：立即reject

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

四、实际应用与调试技巧

4.1 错误处理最佳实践

// 推荐方式：每个then单独处理错误
fetchData()
  .then(processData)
  .then(renderData)
  .catch(handleError);
// 避免方式：嵌套catch导致错误丢失
fetchData().then(data => {
  processData(data).catch(/* 错误不会传递到外层 */);
});

4.2 性能优化建议

1. 减少中间Promise：避免不必要的then链
2. 使用async/await：提升可读性（底层仍基于Promise）
3. 批量操作优化：对频繁的Promise创建使用对象池模式

五、完整实现代码

class MyPromise {
  constructor(executor) {
    this.state = 'pending';
    this.value = undefined;
    this.reason = undefined;
    this.callbacks = [];
    const resolve = value => {
      if (this.state !== 'pending') return;
      this.state = 'fulfilled';
      this.value = value;
      this.callbacks.forEach(cb => cb.onFulfilled(value));
    };
    const reject = reason => {
      if (this.state !== 'pending') return;
      this.state = 'rejected';
      this.reason = reason;
      this.callbacks.forEach(cb => cb.onRejected(reason));
    };
    try {
      executor(resolve, reject);
    } catch (err) {
      reject(err);
    }
  }
  then(onFulfilled, onRejected) {
    onFulfilled = typeof onFulfilled === 'function' ? onFulfilled : v => v;
    onRejected = typeof onRejected === 'function' ? onRejected : err => { throw err; };
    const promise2 = new MyPromise((resolve, reject) => {
      const handleFulfilled = value => {
        setTimeout(() => {
          try {
            const x = onFulfilled(value);
            resolvePromise(promise2, x, resolve, reject);
          } catch (err) {
            reject(err);
          }
        }, 0);
      };
      const handleRejected = reason => {
        setTimeout(() => {
          try {
            const x = onRejected(reason);
            resolvePromise(promise2, x, resolve, reject);
          } catch (err) {
            reject(err);
          }
        }, 0);
      };
      if (this.state === 'fulfilled') {
        handleFulfilled(this.value);
      } else if (this.state === 'rejected') {
        handleRejected(this.reason);
      } else {
        this.callbacks.push({
          onFulfilled: handleFulfilled,
          onRejected: handleRejected
        });
      }
    });
    return promise2;
  }
  // 其他静态方法实现...
}
// 省略resolvePromise等辅助函数（见前文）

六、总结与延伸思考

手写Promise的实现过程揭示了异步编程的核心原理：通过状态机管理、回调队列和值解包协议，构建出可预测的异步流程。实际开发中，理解这些底层机制有助于：

1. 调试复杂的异步错误
2. 优化Promise链的性能
3. 正确处理边界条件（如循环引用）
4. 更好地使用async/await语法（其基于Promise实现）

建议开发者通过单元测试验证手写实现的正确性，重点测试以下场景：

• 状态不可变性
• 异常传播机制
• 返回值解包规则
• 并发Promise处理

掌握Promise的底层实现，不仅能提升代码质量，更能深化对JavaScript事件循环和异步编程模型的理解。