在 RxJS 中，操作符是非常重要的概念。在实际项目中，我们常常会使用 RxJS 的操作符来帮助我们处理数据。本文将会讲解两个常用的 RxJS 操作符：tap 和 catchError，同时附带代码示例。希望读完本文后可以对这两个操作符有更深入的理解。
tap 操作符
tap 操作符可以帮助我们在数据流中插入一些副作用的逻辑，比如打印、记录日志、调试等等。虽然 tap 操作符不会改变流中的数据，但它可以很好的用于调试程序，获取额外的信息来帮助我们更好的理解代码的执行过程。
具体语法如下：
-- -------------------- ---- -------
----------------
-----
----- ---- -- -
-- --------
-----------------
--
------ ----- -- -
-- --------
------------------
--
--------- -- -- -
-- --------
-----------------------
-
--
-下面的代码展示了如何使用 tap 操作符来输出数据流：
-- -------------------- ---- ------- ------ - -- - ---- ------- ------ - --- - ---- ----------------- ----- ------ - ----- -- --- ------------ ------- -- ------------------ ------ ---- ---------- ------- -- --- - ---- ------- -- ------------------ ----- ---- --------- - -------------- -- ------------------
在上面的代码中，我们使用 tap 操作符来获取源数据流的发送值，并分别在 map 操作符之前和之后进行打印。
catchError 操作符
catchError 操作符用于捕捉错误并返回一个新的 observable，可以用于处理意外的错误和异常。 在中间件中处理错误非常重要，它不仅可以避免错误导致程序崩溃，还可以帮助我们更好的控制代码的流程。catchError 操作符的语法如下：
observable.pipe(
catchError((error: any) => {
// 处理错误的逻辑
console.log(error);
// 返回新的 observable
return of(null);
})
)下面的代码展示了如何使用 catchError 操作符来捕获异常：
import { throwError, of } from 'rxjs';
import { catchError } from 'rxjs/operators';
const source = throwError('This is an error!');
const example = source.pipe(catchError(val => of(`I caught: ${val}`)))
example.subscribe(val => console.log(val));在上面的代码中，我们使用 throwError 操作符创建了一个源 observable，它会立即抛出一个错误。然后我们使用 catchError 操作符捕获异常并返回一个新的 observable。在这个例子中，我们返回了一个新的包含错误信息的 observable。
总结
在本文中，我们介绍了 RxJS 中的两个常用操作符：tap 和 catchError。tap 操作符可以帮助我们在数据流中插入一些副作用的逻辑，比如打印、记录日志、调试等等。catchError 操作符用于捕捉错误并返回一个新的 observable，可以用于处理意外的错误和异常。通过学习本文，我们可以更好的理解这两种操作符的作用和用法，并可以用它们来更好的处理数据流中的问题。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/649930b248841e9894626e92