RxJS 是一个响应式编程库，它可以让我们通过使用基于事件流的编程方式来简化异步编程。skipWhile 操作符是 RxJS 中的一种数据筛选和跳过策略，在某些场景下使用起来非常方便，本文将详细介绍其用法以及相关示例。
操作符 skipWhile 复习
在 RxJS 中，skipWhile 操作符可以跳过满足条件的数据，只有当数据不满足条件时才开始发出数据。它的使用语法如下：
skipWhile(predicate: Function): Observable
其中，predicate 参数代表一个回调函数，它会被传入当前发射的值，只有当其返回值为 false 时 skipWhile 才会开始发射数据。
skipWhile 的应用场景
skipWhile 适用于一些需要跳过数据的场景，例如：过滤掉某一时间前的数据，忽略某些特定数据，只处理某些特定数据等。
skipWhile 操作符的示例
下面我们以一个简单的示例来说明 skipWhile 操作符的用法。
首先，我们创建一个 interval 的 Observable，每隔 500 毫秒发送一个数字。然后使用 skipWhile 操作符将跳过在 2000 毫秒之前的数字，从第五个数开始发射。
import { interval } from "rxjs";
import { skipWhile } from "rxjs/operators";
const source$ = interval(500);
source$.pipe(
skipWhile(val => val < 4)
).subscribe(val => console.log(val));上述代码中，predicate 函数表示跳过在 2000 毫秒之前的数字，也就是前四个数字。这里的订阅代码中，我们只发射从第五个数字开始的数据，即 4，5，6，7……
实际场景运用
在实际应用中，skipWhile 操作符经常被用来过滤掉无关紧要或者不符合条件的数据。下面是一个实际场景的示例：
我们需要从一个数组中获取一些特定数据，假设我们需要获取的数据是“奇数”，那么我们可以使用 skipWhile 操作符来把不符合要求的偶数跳过，只处理符合要求的奇数。
import { from } from 'rxjs';
import { skipWhile } from 'rxjs/operators';
const numbers$ = from([1, 2, 3, 4, 5, 6, 7, 8, 9]);
numbers$.pipe(
skipWhile(num => num % 2 === 0)
).subscribe(num => console.log(num)); // 1, 3, 5, 7, 9在上述代码中，我们创建了一个 Observable，它发射了一个数组。我们使用 skipWhile 操作符并传入一个 predicate 回调函数，来跳过不符合条件的偶数。
最后，我们对数据进行 subscribe 就可以获取到从数组中筛选出来的奇数了。
总结
在 RxJS 中，skipWhile 操作符可以跳过不符合条件的数据，实现了简单的数据过滤和切片。在实际使用中，它对于帮助我们处理一些特定的数据非常方便，特别是一些不需要的数据或者需要过滤掉的数据。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/65b86585add4f0e0ff0f05d8