踏入Promise的奇幻世界，手撕简单实现，一路追寻光与希望

Promise，如同它名字“承诺”的寓意，在JavaScript中扮演着信守诺言的使者。它是一个封装异步操作的对象，保证在异步操作完成后，能以恰当的方式处理结果。有了Promise，我们不必再深陷回调地狱的泥沼，而是可以徜徉在链式调用的优雅花园中。

理解Promise

首先，让我们从Promise的本质开始了解。它是一个包含then方法的对象，或者是一个函数。then方法接收两个参数：成功回调函数和失败回调函数。当异步操作成功完成后，将调用成功回调函数；当异步操作失败时，将调用失败回调函数。

应用Promise

掌握了Promise的基本概念，我们就可以亲自动手实现一个简单的Promise。为了避免复杂性，我们将仅处理成功场景，忽略失败场景。

// Promise构造函数
function Promise(executor) {
  // 定义当前Promise的状态
  this.state = 'pending';
  // 定义成功回调函数
  this.onResolve = null;
  // 定义失败回调函数
  this.onReject = null;
  // 执行executor函数，获取异步操作的结果
  executor(
    (result) => {
      // 异步操作成功，将Promise的状态改为成功
      this.state = 'resolved';
      // 执行成功回调函数
      if (this.onResolve) this.onResolve(result);
    },
    (error) => {
      // 异步操作失败，将Promise的状态改为失败
      this.state = 'rejected';
      // 执行失败回调函数
      if (this.onReject) this.onReject(error);
    }
  );
}

// Promise实例对象的then方法
Promise.prototype.then = function (onResolve, onReject) {
  // 根据当前Promise的状态，执行相应的回调函数
  if (this.state === 'resolved') {
    // Promise已成功，执行成功回调函数
    onResolve(this.result);
  } else if (this.state === 'pending') {
    // Promise仍处于等待状态，将回调函数保存起来
    this.onResolve = onResolve;
    this.onReject = onReject;
  }
};

// Promise实例对象的catch方法
Promise.prototype.catch = function (onReject) {
  // 将失败回调函数保存起来
  this.onReject = onReject;
};

// 使用Promise进行异步操作
const promise = new Promise((resolve, reject) => {
  // 模拟异步操作，这里假设异步操作成功
  setTimeout(() => {
    resolve('异步操作成功！');
  }, 2000);
});

// 使用then方法处理异步操作的结果
promise
  .then((result) => {
    console.log(result); // 输出：异步操作成功！
  })
  .catch((error) => {
    console.log(error); // 不会被执行，因为异步操作成功
  });

总结

Promise作为JavaScript中处理异步编程的利器，不仅能帮助我们避免回调地狱的陷阱，更能让我们编写出优雅、可读的异步代码。它为前端开发带来了一片广阔的天地，让开发者可以自由翱翔在异步编程的海洋中。