Rxjs 中处理错误和抓取错误的代码案例

Rxjs 是一款强大的响应式编程库，它能够非常方便地处理各种异步任务。但是在实际项目中，难免会遇到各种错误以及异常情况。Rxjs 提供了很多处理错误和抓取错误的方法，接下来我们将详细讲解。

错误处理方法

catchError

catchError 是 Rxjs 提供的一个异常处理方法，它可以用来捕捉 Observable 序列中的错误，并将错误转化为一个新的 Observable 序列进行处理。示例如下：

import { of } from 'rxjs';
import { catchError, map } from 'rxjs/operators';

const source$ = of([1, 2, 3, 4, 'error', 6, 7, 8, 9]);

const result$ = source$.pipe(
  map((value) => {
    if (typeof value === 'string') {
      throw new Error('数据类型错误！');
    }
    return value * 2;
  }),
  catchError((err) => {
    console.log(err.message);
    return of('处理错误完成！');
  })
);

result$.subscribe((value) => {
  console.log(value);
});

上述代码中，我们使用 of 方法创建一个 Observable 序列，其中包含一个数据类型错误的错误数据。通过 catchError 会在数据流中抓捕到这个错误，然后将异常信息打印到控制台，并将异常结果转化为一个新的 Observable 继续执行。在最后一个订阅中，我们得到了正确的结果。

retry

retry 方法可以用来重试 Observable 序列，当序列执行失败时，它会尝试重新执行序列，直到成功或者超出重试次数。示例如下：

import { interval, throwError } from 'rxjs';
import { retry, catchError } from 'rxjs/operators';

const source$ = interval(500).pipe(
  map(() => {
    if (Math.random() < 0.5) {
      throw new Error('error');
    }
    return 1;
  }),
  retry(2),
  catchError((err) => {
    console.log(err.message);
    return throwError('超过重试次数！');
  })
);

source$.subscribe(
  (value) => {
    console.log(value);
  },
  (err) => {
    console.log(err);
  }
);

上述代码中，我们使用 interval 创建一个每隔 500ms 发射一个数字的 Observable 序列。通过 retry 方法，在出现错误时进行重试，重试次数为 2。在超过重试次数时，使用 throwError 抛出异常信息并结束序列的执行。

错误抓取方法

finalize

finalize 方法可以在 Observable 序列结束时执行某个回调函数，不管序列正常完成还是发生错误。示例如下：

import { of } from 'rxjs';
import { map, finalize } from 'rxjs/operators';

const source$ = of([1, 2, 3, 4, 5]);

const result$ = source$.pipe(
  map((value) => {
    if (typeof value === 'string') {
      throw new Error('数据类型错误！');
    }
    return value * 2;
  }),
  finalize(() => {
    console.log('执行完成！');
  })
);

result$.subscribe((value) => {
  console.log(value);
});

上述代码中，我们使用 of 方法创建一个 Observable 序列，其中包含一个数据类型错误的错误数据。通过 finalize 方法，当序列结束时，无论是否发生错误，都会执行 console.log('执行完成！')。

tap

tap 方法可以实现类似 AOP 切面编程的效果，这个方法不会改变数据流，但是可以在数据流中插入副作用。示例如下：

import { of } from 'rxjs';
import { map, tap } from 'rxjs/operators';

const source$ = of([1, 2, 3, 4, 5]);

const result$ = source$.pipe(
  map((value) => {
    if (typeof value === 'string') {
      throw new Error('数据类型错误！');
    }
    return value * 2;
  }),
  tap(() => {
    console.log('执行中！');
  })
);

result$.subscribe((value) => {
  console.log(value);
});

上述代码中，我们使用 of 方法创建一个 Observable 序列，其中包含一个数据类型错误的错误数据。通过 tap 方法插入副作用，当执行流时控制台会打印“执行中！”。