Promise 中的 then() 方法详解

阅读时长 6 分钟读完

在前端开发中,我们经常会用到 Promise 来解决异步的问题。在 Promise 中,then() 方法是经常使用的一个方法,它具有很强的灵活性和可扩展性。在本文中,我们将对 Promise 中的 then() 方法进行详细的介绍,希望能够帮助大家更好地理解和使用 Promise。

Promise 简介

在介绍 then() 方法之前,我们先简要介绍一下 Promise。

Promise 是一种用于处理异步操作的技术。它可以将异步操作封装成一个 Promise 对象,这个对象具有三种状态:pending(等待中)、fulfilled(已完成)和 rejected(已失败)。当异步操作完成后,Promise 对象将会被 resolve(解决)或 reject(拒绝),并且最终返回一个被解决或被拒绝的值。

then() 方法的作用

then() 方法是 Promise 对象中的一个方法,它用于指定当 Promise 对象解决时要做的事情。 then() 方法接受两个参数:resolve 函数和 reject 函数,当 Promise 对象被 resolve 时,会调用 resolve 函数,当 Promise 对象被 reject 时,会调用 reject 函数。而且,then() 方法还可以链式调用,方便我们编写异步代码。

then() 方法示例

下面通过一个简单的示例来说明 then() 方法的用法。

在上面的示例中,我们首先创建了一个 Promise 对象,使用 setTimeout 函数模拟异步处理结果。然后我们使用 then() 方法接收 resolve 函数的返回结果并打印在控制台上。

上述代码的输出结果为:

当我们执行 then() 方法后,它会等待 Promise 对象被 resolve(解决),并且在解决后执行指定的回调函数。

then() 方法的返回值

了解了 then() 方法的基本用法后,我们再来看看它的返回值。then() 方法的返回值是一个全新的 Promise 对象。这个 Promise 对象的状态和值取决于回调函数的返回值。

如果回调函数返回一个值,那么新的 Promise 对象就会被 resolve,并且其值就是回调函数返回的值。

-- -------------------- ---- -------
--- ------- - --- ----------------- ------- -- -
  ------------- -- --------------------- ------
---

--------------------- -- -
  ------ ----- -----------
---------------- -- -
  --------------------
---
展开代码

输出结果为:

上述代码中,我们通过 then() 方法的回调函数返回了一个字符串。这个字符串就是新的 Promise 对象的值。由于这个 Promise 对象被 resolve,所以我们可以在后续的 then() 方法中使用它。

如果回调函数返回一个 Promise 对象,那么新的 Promise 对象的状态和值将会和返回的 Promise 对象相同。

-- -------------------- ---- -------
--- ------- - --- ----------------- ------- -- -
  ------------- -- --------------------- ------
---

--------------------- -- -
  ------ --- ----------------- ------- -- -
    ------------- -- ------------- ------------ ------
  ---
---------------- -- -
  --------------------
---
展开代码

输出结果为:

上述代码中,我们通过 then() 方法的回调函数返回了一个 Promise 对象。这个 Promise 对象被 resolve 后,新的 Promise 对象也就被 resolve 了。

then() 方法的错误处理

在 Promise 中,还有一个很重要的特性是错误处理。在 then() 方法中,我们可以使用第二个参数指定回调函数处理 Promise 对象的 reject,避免程序因异常而中断。

-- -------------------- ---- -------
--- ------- - --- ----------------- ------- -- -
  ------------- -- ---------- -------------------- ------
---

--------------------- -- -
  --------------------
-- ------- -- -
  ---------------------
---
展开代码

上述代码中,我们故意将 Promise 对象设置为 rejected 状态,然后使用 then() 方法中的第二个参数来处理异常。这样就可以避免因为异常而导致程序中断。

then() 方法的链式调用

Promise 中 then() 方法的一个很重要的特性就是链式调用。我们可以通过链式调用来更直观、简洁地编写异步代码。

-- -------------------- ---- -------
--- ------- - --- ----------------- ------- -- -
  ------------- -- ----------- ------
---------------- -- -
  --------------------
  ------ --- ----------------- ------- -- -
    ------------- -- --------- - -------- ------
  ---
---------------- -- -
  --------------------
  ------ --- ----------------- ------- -- -
    ------------- -- --------- - -------- ------
  ---
---------------- -- -
  --------------------
---
展开代码

输出结果为:

上述代码中,我们通过链式调用来解决了异步代码的多层嵌套问题。同时,我们还可以通过 then() 方法的返回值来链式调用后续的回调函数。

结语

本文详细介绍了 Promise 中的 then() 方法的用法和特性。then() 方法很灵活,不仅可以接受回调函数处理异步结果,还可以链式调用。在实际开发中,使用 then() 方法能够帮助我们更高效地编写异步代码。

来源:JavaScript中文网 ,转载请注明来源 https://www.javascriptcn.com/post/67b9b939306f20b3a682cadb

纠错
反馈

纠错反馈