JavaScript 中原生封装 Promise 对象

在 JavaScript 中，Promise 对象用于处理异步操作。为了简化 Promise 的使用，我们经常会对其进行封装。本文将介绍如何使用原生 JavaScript 封装一个 Promise 对象，并探讨其中涉及的最佳实践和注意事项。

1. 创建 Promise 对象

首先，我们创建一个 Promise 对象，它接受一个函数作为参数，该函数包含两个回调函数：resolve 和 reject。这两个回调函数用于在 Promise 对象上分别触发 fulfilled 和 rejected 状态。

const myPromise = new Promise((resolve, reject) => {
  // ... 处理异步操作
  if (异步操作成功) {
    resolve(结果);
  } else {
    reject(错误);
  }
});

2. 封装 then 方法

Promise 对象的 then 方法用于处理 fulfilled 和 rejected 状态。我们可以封装 then 方法，使其返回一个新的 Promise 对象。

Promise.prototype.myThen = function(onFulfilled, onRejected) {
  return new Promise((resolve, reject) => {
    this.then(result => {
      try {
        resolve(onFulfilled(result));
      } catch (error) {
        reject(error);
      }
    }, error => {
      try {
        resolve(onRejected(error));
      } catch (error) {
        reject(error);
      }
    });
  });
};

3. 使用封装的 then 方法

现在，我们可以使用封装后的 myThen 方法来处理 Promise 的状态。

myPromise.myThen(result => {
  // 处理 fulfilled 状态
}, error => {
  // 处理 rejected 状态
});

4. 封装 catch 方法

Promise 对象的 catch 方法用于处理 rejected 状态。我们可以封装 catch 方法，使其返回一个新的 Promise 对象。

Promise.prototype.myCatch = function(onRejected) {
  return this.myThen(undefined, onRejected);
};

5. 使用封装的 catch 方法

我们可以使用封装后的 myCatch 方法来处理 Promise 的 rejected 状态。

myPromise.myCatch(error => {
  // 处理 rejected 状态
});

6. 封装 finally 方法

Promise 对象的 finally 方法无论 Promise 是 fulfilled 还是 rejected 都会执行。我们可以封装 finally 方法，使其返回一个新的 Promise 对象。

Promise.prototype.myFinally = function(onFinally) {
  return this.myThen(result => {
    onFinally();
    return result;
  }, error => {
    onFinally();
    throw error;
  });
};

7. 使用封装的 finally 方法

我们可以使用封装后的 myFinally 方法无论 Promise 是 fulfilled 还是 rejected 都执行特定操作。

myPromise.myFinally(() => {
  // 在 Promise 完成后执行
});

8. 最佳实践

• 始终确保在 resolve 或 reject 回调函数中调用，因为 Promise 一旦被触发就不能再改变状态。
• 避免在 then 或 catch 回调函数中使用 return，因为这可能会导致意外行为。
• 考虑使用 async/await 语法，它可以简化异步操作的处理。

9. 注意事项

• 封装的 then 方法中的 onFulfilled 和 onRejected 回调函数必须放在本轮任务队列的末尾，以便后续代码能够正确执行。
• catch 和 finally 方法都是基于 then 方法实现的，因此具有与 then 方法相同的限制和注意事项。

总结

原生封装 Promise 对象可以简化异步操作的处理。通过封装 then、catch 和 finally 方法，我们可以增强 Promise 的灵活性，并使用定制的行为对其进行扩展。然而，重要的是遵循最佳实践和注意事项，以确保封装的 Promise 对象的正确功能。