第181题：Promise.prototype.finally 的作用，如何自己实现 Promise.prototype.finally？

Question

Promise.prototype.finally() 是 ES2018 新增的特性，它回一个 Promise ，在 promise 结束时，无论 Promise 运行成功还是失败，都会运行 finally ，类似于我们常用的 try {...} catch {...} finally {...}

Promise.prototype.finally() 避免了同样的语句需要在 then() 和 catch() 中各写一次的情况

new Promise((resolve, reject) => {
  setTimeout(() => resolve("result"), 2000)
})
  .then(result => console.log(result))
  .finally(() => console.log("Promise end"))

// result
// Promise end

reject :

new Promise((resolve, reject) => {
  throw new Error("error")
})
  .catch(err => console.log(err))
  .finally(() => console.log("Promise end"))

// Error: error
// Promise end

注意：

• finally 没有参数
• finally 会将结果和 error 传递

new Promise((resolve, reject) => {
  setTimeout(() => resolve("result"), 2000)
})
  .finally(() => console.log("Promise ready"))
  .then(result => console.log(result))

// Promise ready
// result

手写一个 Promise.prototype.finally()

不管 Promise 对象最后状态如何，都会执行的操作

MyPromise.prototype.finally = function (cb) {
  return this.then(function (value) {
    return MyPromise.resolve(cb()).then(function () {
      return value
    })
  }, function (err) {
    return MyPromise.resolve(cb()).then(function () {
      throw err
    })
  })
}

Answer 1

Promise.prototype.myFinally = async function (cb) {
  const pr = this;
  try {
    await pr;
  } finally {
    cb && cb();
  }
};

const start = () => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      const temp = Math.round(Math.random());
      if (temp > 0.5) {
        resolve(temp);
      } else {
        reject(temp);
      }
    }, 2000);
  });
};

start()
  .then((res) => {
    console.log("res", res);
  })
  .catch((err) => {
    console.log("err", err);
  })
  .myFinally(() => {
    console.log("finally");
  });

更多解析

Answer 2

Promise.prototype.finally() 的作用

Promise.prototype.finally() 是 ES2018 新增的特性，它回一个 Promise ，在 promise 结束时，无论 Promise 运行成功还是失败，都会运行 finally ，类似于我们常用的  try {...} catch {...} finally {...}

Promise.prototype.finally() 避免了同样的语句需要在 then() 和 catch() 中各写一次的情况

new Promise((resolve, reject) => {
  setTimeout(() => resolve("result"), 2000)
})
  .then(result => console.log(result))
  .finally(() => console.log("Promise end"))

// result
// Promise end

reject :

new Promise((resolve, reject) => {
  throw new Error("error")
})
  .catch(err => console.log(err))
  .finally(() => console.log("Promise end"))

// Error: error
// Promise end

注意：

• finally 没有参数
• finally 会将结果和 error 传递

new Promise((resolve, reject) => {
  setTimeout(() => resolve("result"), 2000)
})
  .finally(() => console.log("Promise ready"))
  .then(result => console.log(result))

// Promise ready
// result

手写一个 Promise.prototype.finally()

不管 Promise 对象最后状态如何，都会执行的操作

MyPromise.prototype.finally = function (cb) {
  return this.then(function (value) {
    return MyPromise.resolve(cb()).then(function () {
      return value
    })
  }, function (err) {
    return MyPromise.resolve(cb()).then(function () {
      throw err
    })
  })
}

原文

Answer 3

  finally(callBack) {
    return this.then(
      (value) => {
        return MyPromise.resolve(callBack()).then(() => value);
      },
      (reason) => {
        return MyPromise.resolve(callBack()).then(() => {
          throw reason;
        });
      }
    );
  }