在 RxJS 中，partition 操作符可以将一个 Observable 流中的数据根据指定的条件分成两个流，一个符合条件，另一个不符合条件。这个操作符非常实用，可以让我们轻松地对数据进行筛选和分类。本文将对 RxJS 中的 partition 操作符进行详细讲解，并提供实用的示例代码。
partition 操作符的基本用法
partition 操作符的基本语法如下：
partition<T>( predicate: (value: T, index: number, source: Observable<T>) => boolean, thisArg?: any ): [Observable<T>, Observable<T>];
其中，predicate 是一个回调函数，它接收三个参数：value 表示当前值，index 表示当前索引，source 表示原始的 Observable。这个函数必须返回一个 bool 类型的值，表示当前值是否符合条件。如果返回 true，则这个值会被发送到第一个 Observable 中；如果返回 false，则这个值会被发送到第二个 Observable 中。
我们来看一个简单的例子：
import { from } from "rxjs";
import { partition } from "rxjs/operators";
const source = from([1, 2, 3, 4, 5, 6]);
const [evens$, odds$] = source.pipe(partition((x) => x % 2 === 0));
evens$.subscribe((x) => console.log(`even: ${x}`));
odds$.subscribe((x) => console.log(`odd: ${x}`));在这个例子中，我们创建了一个包含 1 到 6 的数字序列的 Observable（使用了 RxJS 中的 from 操作符），然后使用 partition 操作符将其分为偶数和奇数两个流。最后，我们分别订阅了这两个流，输出偶数和奇数。
输出结果如下：
even: 2 odd: 1 even: 4 odd: 3 even: 6 odd: 5
partition 操作符的高级用法
除了基本用法之外，partition 操作符还有一些高级用法。下面将详细讲解这些用法。
使用合适的数据类型
在使用 partition 操作符时，我们需要注意选择合适的数据类型。如果我们将一个无限的流分成两个流，那么其中一个流就永远不会完成，导致程序无法正常终止。因此，在这种情况下，我们应该选择 take 操作符将流限制为有限长度。
-- -------------------- ---- ------- ------ - -------- - ---- ------- ------ - ---------- ---- - ---- ----------------- ----- ------ - --------------- ----- -------- ------ - ------------ --------- ------------- -- - - - --- -- -- -------------------- -- ------------------ -------- ------------------- -- ----------------- --------
在这个例子中，我们使用了 RxJS 中的 interval 操作符创建了一个无限的流，并使用 take 操作符将其限制为只有前 10 个值。然后，我们使用 partition 操作符将这些值分为偶数和奇数。最后，我们分别订阅了它们，输出偶数和奇数。
输出结果如下：
-- -------------------- ---- ------- ----- - ---- - ----- - ---- - ----- - ---- - ----- - ---- - ----- - ---- -
使用延迟计算
在 partition 操作符中，predicate 回调函数是每次值到来时都会被调用的。如果这个回调函数计算量很大，那么会影响程序的性能。为了避免这种情况，我们可以使用 delay 管道操作符将 predicate 的计算延迟到异步操作中。
-- -------------------- ---- ------- ------ - ---- - ---- ------- ------ - ------ --------- - ---- ----------------- ----- ------ - -------- -- -- -- -- ---- ----- -------- ------ - ------------ ------------- -- - - - --- - -- --------------------- ------- -- -------------------- -- -------------------- -- ------------------ -------- ------------------- -- ----------------- -------- -------- ------------------- ------- - ------------------ ----------- --- ------- -- ------ -- ---- ----- ----------- ---- ------ ----- -
在这个例子中，我们定义了一个 heavyCalculation 函数来模拟一个计算量很大的操作。然后，我们使用 partition 操作符将流分为两个流，其中一个是 heavyCalculation 返回 true 的值，另一个是 heavyCalculation 返回 false 的值。最后，我们使用 delay 操作符将 heavyCalculation 的计算延迟到了一个异步操作中。
输出结果如下：
-- -------------------- ---- ------- ----- ----------- --- - ----- - ----- ----------- --- - ----- - ----- ----------- --- - ----- - ---- - ----- ----------- --- - ---- - ----- ----------- --- - ---- -
处理 Observable 的错误
在进行 RxJS 编程时，我们常常需要处理 Observable 的错误。如果使用 partition 操作符分为两个流，那么错误可能只会发生在其中一个流上，另一个流可能顺利完成。这时候，我们需要使用 catchError 操作符来处理这种情况。
-- -------------------- ---- -------
------ - ----------- ---- - ---- -------
------ - ---------- ---------- - ---- -----------------
----- ------ - -------- -- -- -- -- ----
----- -------- ------ - ------------
------------- -- -
-- -- --- -- -
------ ------------------- ---------
- ---- -
------ - - - --- --
-
---
---------------- ------- -- -------
--
-------------------- -- ------------------ --------
------------------- -- ----------------- --------在这个例子中，我们在 predicate 回调函数中故意将值为 3 的数据抛出一个错误。这样的话，这个错误就会发生在 odds$ 流上。为了让程序继续运行，我们需要使用 catchError 操作符捕获这个错误，并将其转成 caught 可观察对象。
输出结果如下：
even: 2 even: 4 even: 6 odd: 1 odd: 5
总结
使用 partition 操作符将 Observable 分为两个流是 RxJS 编程中的一个常见需求。本文详细介绍了这个操作符的基本用法和高级用法。如果你正在进行 RxJS 编程，那么 partition 操作符一定会给你带来很大的帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/645f339d968c7c53b0146ba4