RxJS 是一个强大的 JavaScript 库，用于异步编程。它使我们能够轻松地处理 DOM 事件、Xhr 请求、WebSocket 和其他种类的异步操作。但是，由于异步操作的不可预知性和不确定性，我们需要一种方法来处理和管理这些操作中可能出现的错误。这就是 RxJS 中的错误处理。
RxJS 提供了两个主要的错误处理操作符：catchError 和 retryWhen。这些操作符让您能够在 RxJS 流中对错误进行更细粒度的处理和解决方案。
catchError 操作符
catchError 操作符用于捕获和处理 RxJS 流中的错误。如果您没有为流中的错误提供明确定义的处理方法，错误会沿着流传递并且最终到达“全局”错误处理程序。由此导致的问题是，您失去了对错误的控制，而无法采取适当的措施来解决它们。
catchError 操作符解决了这个问题。它允许您针对流中发生的每个错误提供一个自定义的错误处理程序。您可以使用 catchError 操作符处理单个错误，复杂和多级错误处理都是可能的。
下面是 catchError 操作符的语法：
---------------------------------- -- - -- ------- ------ --------------- ----
在这种情况下，当发生错误时会执行 catchError 函数内的回调函数。该函数可以根据错误类型、错误代码或错误消息将流重定向到不同的流中，然后可以在新的流中重新启用或提供新的流或数据。
catchError 操作符示例
------ - -- - ---- -------
------ - ---------- - ---- -----------------
----- ---------- - -- -- -
----- --- ---------------- ---- --------
--
----- ------- - ------- ---- ------------- ---- -----
-------
------
------------------ -- -
--------------------
------ ------- ---- -----
--
-
------------------ -- --------------------在此示例中，我们使用 of 操作符创建了一个执行 A、B、throwError()、C 和 D 操作的 observable。throwError() 操作故意没有提供实际的实现，并抛出了一个错误。
我们通过在源 observable 上执行 catchError 操作，并在 catchError 中记录错误和提供一个新的 observable，对这个错误进行了处理。在浏览器控制台中，会打印出错误消息“Something went wrong”，然后源 observable 的值流将被重定向并用 X、Y、Z 替换。在最终的订阅中，我们使用 console.log 打印出发出的值。
retryWhen 操作符
retryWhen 操作符是另一个有用的错误处理方法，它对同一错误的重试提供了细粒度的控制。它让您可以指定在错误发生时进行重试的条件和策略，从而更好地控制流的行为。
retryWhen 操作符将源 observable 转换为一个新的 observable，该 observable 在过了一定的时间后，重新订阅源 observable。在这个新的订阅中，如果源 observable 再次发出错误，retryWhen 可以在满足条件时重新订阅源 observable。
下面是 retryWhen 操作符的语法：
---------------------------------- -- - -- ------- ------ --------------- ----
这里传递给 retryWhen 函数的参数 errors 是一个错误 observable，它接收来自 retryWhen 下游 observable 中的错误。在 retryWhen 中，错误 observable 的行为非常类似 catchError 中的 observable，重新订阅源 observable 后可以提供一个流或数据。
retryWhen 操作符示例
------ - --------- ----- - ---- -------
------ - ---------- -------- - ---- -----------------
----- ------- - ---------------
-------
------
---------------- -- -
-- ------ - -- -
------ ------------ -- ----------
-
------ ----------
---
------------------ --
------------
---------------- ------ --
----- - - - --------- - -------------------- -------
-
-
-
-
------------
----- ------- -- -------------------
------ ------- -- ---------------------
---在这个示例中，我们用 4 秒后的 timer 替换了 value 大于 5 的值。retryWhen 下游 observable 在接收到错误时会重新订阅源 observable，但是该示例只对前两个重试尝试进行了重试。在第三次重试之后，我们使用 throwError 操作停止了源 observable。最终，在订阅中，我们响应源 observable 的错误，并打印出错误消息。
总结
在 RxJS 中使用 catchError 和 retryWhen 操作符时，可以捕获和处理异步流中可能出现的错误。这些操作符可以让您将错误处理颗粒度提高到一个新高度，以便更好地控制和管理错误。
使用 catchError 和 retryWhen 操作符的关键在于提供适当的错误处理程序和策略。这样可以确保您在出现错误时可以采取适当的措施，以便优化流的行为以适应您的应用程序的需要。
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/65922035eb4cecbf2d706f64