RxJS groupBy

根據(jù)指定條件將 Observable 發(fā)出的項目分組， 并發(fā)出這些分組的項目為 GroupedObservables，一個 GroupedObservable每組。

groupBy<T, K, R>(keySelector: (value: T) => K, elementSelector?: void | ((value: T) => R), durationSelector?: (grouped: GroupedObservable<K, R>) => Observable<any>, subjectSelector?: () => Subject<R>): OperatorFunction<T, GroupedObservable<K, R>>

參量

returns

OperatorFunction<T, GroupedObservable<K, R>>：發(fā)出的可觀察物 GroupedObservables，每個對應(yīng)于唯一鍵值，每個 其中從源Observable發(fā)出共享該密鑰的那些項 值。

描述

When the Observable emits an item, a key is computed for this item with the keySelector function.

If a GroupedObservable for this key exists, this GroupedObservable emits. Elsewhere, a new GroupedObservable for this key is created and emits.

A GroupedObservable represents values belonging to the same group represented by a common key. The common key is available as the key field of a GroupedObservable instance.

The elements emitted by GroupedObservables are by default the items emitted by the Observable, or elements returned by the elementSelector function.

Examples

Group objects by id and return as array

import { of } from 'rxjs';
import { mergeMap, groupBy, reduce } from 'rxjs/operators';


of(
  {id: 1, name: 'JavaScript'},
  {id: 2, name: 'Parcel'},
  {id: 2, name: 'webpack'},
  {id: 1, name: 'TypeScript'},
  {id: 3, name: 'TSLint'}
).pipe(
  groupBy(p => p.id),
  mergeMap((group$) => group$.pipe(reduce((acc, cur) => [...acc, cur], []))),
)
.subscribe(p => console.log(p));


// displays:
// [ { id: 1, name: 'JavaScript'},
//   { id: 1, name: 'TypeScript'} ]
//
// [ { id: 2, name: 'Parcel'},
//   { id: 2, name: 'webpack'} ]
//
// [ { id: 3, name: 'TSLint'} ]

id字段上的數(shù)據(jù)透視表

import { of } from 'rxjs';
import { groupBy, map, mergeMap, reduce } from 'rxjs/operators';


of(
  { id: 1, name: 'JavaScript' },
  { id: 2, name: 'Parcel' },
  { id: 2, name: 'webpack' },
  { id: 1, name: 'TypeScript' },
  { id: 3, name: 'TSLint' }
)
  .pipe(
    groupBy(p => p.id, p => p.name),
    mergeMap(group$ =>
      group$.pipe(reduce((acc, cur) => [...acc, cur], [`${group$.key}`]))
    ),
    map(arr => ({ id: parseInt(arr[0], 10), values: arr.slice(1) }))
 )
 .subscribe(p => console.log(p));


// displays:
// { id: 1, values: [ 'JavaScript', 'TypeScript' ] }
// { id: 2, values: [ 'Parcel', 'webpack' ] }
// { id: 3, values: [ 'TSLint' ] }

Overloads

groupBy(keySelector: (value: T) => K): OperatorFunction<T, GroupedObservable<K, T>> Parameters keySelector Type: (value: T) => K. Returns OperatorFunction<T, GroupedObservable<K, T>>

groupBy(keySelector: (value: T) => K, elementSelector: void, durationSelector: (grouped: GroupedObservable<K, T>) => Observable<any>): OperatorFunction<T, GroupedObservable<K, T>> Parameters keySelector Type: (value: T) => K. elementSelector Type: void. durationSelector Type: (grouped: GroupedObservable) => Observable. returns OperatorFunction<T, GroupedObservable<K, T>>

groupBy(keySelector: (value: T) => K, elementSelector?: (value: T) => R, durationSelector?: (grouped: GroupedObservable<K, R>) => Observable<any>): OperatorFunction<T, GroupedObservable<K, R>>

returns OperatorFunction<T, GroupedObservable<K, R>>

groupBy(keySelector: (value: T) => K, elementSelector?: (value: T) => R, durationSelector?: (grouped: GroupedObservable<K, R>) => Observable<any>, subjectSelector?: () => Subject<R>): OperatorFunction<T, GroupedObservable<K, R>>

returns OperatorFunction<T, GroupedObservable<K, R>>