手写Promise-catch和finally

在上一篇文章中，我们一步步实现了 Promise 的两个静态方法 resolve 和 reject。今天，我们将继续深入，手写实现两个同样重要的实例方法：catch 与 finally。

这两个方法在日常开发中极为常用，理解其内部机制，不仅能帮助我们更好地处理异步流程，也能提升代码的健壮性与可读性。接下来，就让我们一起动手，揭开它们背后的实现逻辑。

实现catch方法

根据 MDN 对 catch 方法的定义：

Promise 实例的 catch() 方法用于注册一个在 promise 被拒绝时调用的函数。它会立即返回一个等效的 Promise 对象，这可以允许你链式调用其他 promise 的方法。此方法是 Promise.prototype.then(undefined, onRejected) 的一种简写形式。

由此可见，catch 方法本质上是 then 方法的语法糖，专门用于处理错误场景。

js 复制代码

/* definePropertyConfig、checkPromiseInstance在之前的文章已经实现 */
definePropertyConfig(prototype, "catch", function (onRejected) {
  checkPromiseInstance(this);
  return this.then(undefined, onRejected);
});

实现finally方法

与 catch 方法类似，我们首先需要校验调用者是否为 Promise 实例。

js 复制代码

definePropertyConfig(prototype, "finally", function (onFinally) {
  checkPromiseInstance(this);
});

1. 参数验证与函数检查

如果传入的 onFinally 不是函数，则直接返回一个与原 Promise 状态相同的 Promise（实现值穿透）。

js 复制代码

definePropertyConfig(prototype, "finally", function (onFinally) {
  checkPromiseInstance(this);
  if (typeof onFinally !== 'function') {
    return this.then()
  }
});

2. 处理成功与失败情况

finally 方法需确保无论原始 Promise 是成功还是失败，都会执行传入的回调函数。同时，它还会保持原始 Promise 的解析值，除非 onFinally 返回一个被拒绝的 Promise。

js 复制代码

p.finally(() => Promise.resolve('hello')); // 等待Promise完成，但忽略解析值，保持原始值
promise.finally(() => Promise.reject("finally拒绝")); // 最终的Promise会以"finally拒绝"被拒绝，覆盖原始结果

完整代码实现：

js 复制代码

definePropertyConfig(prototype, "finally", function (onFinally) {
  checkPromiseInstance(this);
  if (typeof onFinally !== 'function') {
    return this.then()
  }
  return this.then(
    function (value) {
      return Promise.resolve(onFinally()).then(function () {
        return value;
      });
    },
    function (reason) {
      return Promise.resolve(onFinally()).then(function () {
        throw reason;
      });
    }
  );
});

至此，finally 方法已实现完成。它在实际开发中常用于执行清理工作，例如释放资源、关闭文件等，确保无论异步操作成功与否，某些收尾逻辑都能得到执行。

通过本文的实现，我们不仅加深了对 catch 和 finally 方法的理解，也进一步巩固了 Promise 链式调用的机制。希望这些内容能帮助你在日常开发中更加得心应手地处理异步流程。