Chained promises not passing on rejection

在前端开发中,使用 Promise 对象可以方便地处理异步操作。但是,在链式调用多个 Promise 时,可能会出现问题,即当一个 Promise 被拒绝时,该拒绝原因没有传递到后续的 Promise 链中。本文将讨论这个问题,并提供解决方案。

问题

考虑以下代码示例:

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

我们期望第一个 then 中返回的 Promise 被拒绝,并跳转到 catch 块。然而,实际上,第二个 then 中的代码也被执行了,而且控制台输出了一条错误信息。

这是因为在第一个 then 中返回的 Promise 被拒绝后,后续的 then 中没有显式地处理该拒绝。相反,它们创建了新的 Promise 并将其解析(resolved)。

解决方案

为了确保 Promise 链上的每个 Promise 都能正确地处理拒绝,我们需要对每个 then 块返回的 Promise 进行处理。具体来说,我们应该在每个 then 块中使用 return Promise.reject(error) 来将拒绝原因传递到下一个 Promise。

改进后的代码示例如下:

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

在第二个 then 块中,我们添加了一个错误处理程序(error handler),它会将拒绝原因重新抛出。这样,如果前面的某个 Promise 被拒绝,后续的 then 块就不会执行,并且控制台只会输出一条错误信息。

结论

在使用 Promise 链时,确保每个 then 块都正确地处理拒绝非常重要。否则,可能会导致意外行为和难以调试的 bug。通过在每个 then 块中显式地处理拒绝,我们可以确保代码的稳定性和可靠性。

本文提供的解决方案只是其中之一,实际上还有其他方法来解决这个问题。但无论选用哪种方法,我们应该始终牢记 Promise 的核心概念:异步操作的结果不是立即可用的,需要通过 Promise 对象来处理。

来源:JavaScript中文网 ,转载请注明来源 本文地址:https://www.javascriptcn.com/post/31379