返回

一招教你手写 Promise 核心原理

前端

终于到了剖析 Promise 核心原理的最后一篇,也是最重要的一篇。在这一篇,我们会介绍 Promise 的 then 方法,以及如何使用 then 方法来处理 Promise 的结果。

Promise 的 then 方法是 Promise 最核心的方法之一,也是使用 Promise 最常用的方法。then 方法允许我们在 Promise 完成后执行回调函数,并处理 Promise 的结果。

then 方法有两种形式:

  1. then(onFulfilled, onRejected)
  2. then(onFulfilled)

第一种形式的 then 方法接受两个参数:onFulfilled 和 onRejected。onFulfilled 是一个回调函数,在 Promise 完成并且结果为 fulfilled 时执行。onRejected 是一个回调函数,在 Promise 完成并且结果为 rejected 时执行。

第二种形式的 then 方法只接受一个参数:onFulfilled。onFulfilled 是一个回调函数,在 Promise 完成时执行,无论结果是 fulfilled 还是 rejected。

then 方法返回一个新的 Promise,这个新的 Promise 的结果取决于 onFulfilled 和 onRejected 函数的执行结果。

如果 onFulfilled 函数执行成功,则新的 Promise 的结果为 fulfilled,并且新的 Promise 的值是 onFulfilled 函数的返回值。

如果 onFulfilled 函数执行失败,则新的 Promise 的结果为 rejected,并且新的 Promise 的值是 onFulfilled 函数抛出的错误。

如果 onRejected 函数执行成功,则新的 Promise 的结果为 fulfilled,并且新的 Promise 的值是 onRejected 函数的返回值。

如果 onRejected 函数执行失败,则新的 Promise 的结果为 rejected,并且新的 Promise 的值是 onRejected 函数抛出的错误。

举个例子,以下代码演示了如何使用 then 方法来处理 Promise 的结果:

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('成功');
  }, 1000);
});

promise.then((result) => {
  console.log(result); // '成功'
}).catch((error) => {
  console.log(error); // 不会被调用
});

在上面的代码中,我们首先创建了一个 Promise,然后使用 then 方法来处理 Promise 的结果。如果 Promise 的结果为 fulfilled,则会执行 then 方法中的第一个回调函数,并输出结果。如果 Promise 的结果为 rejected,则会执行 then 方法中的第二个回调函数,并输出错误。

then 方法是 Promise 最核心的方法之一,也是使用 Promise 最常用的方法。通过掌握 then 方法,我们可以轻松实现复杂的异步操作。