在前端开发中，数据处理是非常重要的。在处理数据的过程中，对数据进行分组操作是经常遇到的场景。本文介绍 RxJS 中提供的数据分组操作函数，帮助你更加高效地处理数据。
RxJS 中的数据分组
RxJS 中提供了 groupBy 和 partition 方式来进行数据分组操作。
groupBy
groupBy 操作符将源 Observable 发出的项分组为一个新的 Observable，这个 Observable 每个分组都发出一个子 Observable，这个子 Observable 发出所有被分组到同一组的项。
// javascriptcn.com 代码示例
import { from } from 'rxjs';
import { groupBy, mergeMap, toArray } from 'rxjs/operators';
const source = from([{id: 1, name: 'Jack'}, {id: 2, name: 'John'}, {id: 3, name: 'Mark'},
{id: 4, name: 'Lucy'}, {id: 5, name: 'Lucas'}, {id: 6, name: 'Linda'}]);
const example = source.pipe(
groupBy(person => person.name.charAt(0)),
mergeMap(group => group.pipe(toArray()))
);
example.subscribe(val => console.log(val));输出：
[
[{id: 1, name: 'Jack'}, {id: 2, name: 'John'}, {id: 3, name: 'Mark'}],
[{id: 4, name: 'Lucy'}, {id: 5, name: 'Lucas'}, {id: 6, name: 'Linda'}]
]在上述例子中，我们将 persons 数组中的对象根据其名字的首字母进行分组。最终输出的是一个二维数组，子数组中包含按首字母分组的人员信息。
partition
partition 操作符将源 Observable 发出的项分成两个 Observable。将使得新的 Observables 比较容易地在一个条件为真或为假时订阅源 Observable 的子集。
import { from } from 'rxjs';
import { partition } from 'rxjs/operators';
const source = from([1, 2, 3, 4, 5, 6]);
const [even, odd] = source.pipe(partition(num => num % 2 === 0));
even.subscribe(val => console.log(`Even: ${val}`));
odd.subscribe(val => console.log(`Odd: ${val}`));输出：
Even: 2 Odd: 1 Even: 4 Odd: 3 Even: 6
在上述例子中，我们将源 Observable 发出的项分成了两个 Observable，一个包含偶数，另一个包含奇数。
总结
RxJS 中的 groupBy 和 partition 操作符能够帮助我们更加高效地进行数据分组，从而更好地处理数据。当我们遇到数据分组的场景时，可以考虑使用这两个操作符来处理数据。
参考
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/654c600e7d4982a6eb5ead26