From 5738d7ded58a59b2a8f1377633e3b5e32eb41b2c Mon Sep 17 00:00:00 2001 From: pmartin Date: Sat, 28 Oct 2017 22:43:35 +0200 Subject: [PATCH 1/2] docs(groupBy): Add documentation for groupBy operator --- src/operator-docs/transformation/groupBy.ts | 123 +++++++++++++++++++- 1 file changed, 120 insertions(+), 3 deletions(-) diff --git a/src/operator-docs/transformation/groupBy.ts b/src/operator-docs/transformation/groupBy.ts index 6fa16b51..a0093988 100644 --- a/src/operator-docs/transformation/groupBy.ts +++ b/src/operator-docs/transformation/groupBy.ts @@ -1,6 +1,123 @@ -import { OperatorDoc } from '../operator.model'; +import { OperatorDoc } from "../operator.model"; export const groupBy: OperatorDoc = { - 'name': 'groupBy', - 'operatorType': 'transformation' + name: "groupBy", + operatorType: "transformation", + signature: ` + public groupBy(keySelector: (value: T) => K, + elementSelector?: ((value: T) => R) | void, + durationSelector?: (grouped: GroupedObservable) => Observable, + subjectSelector?: () => Subject) + : Observable): OperatorFunction>`, + parameters: [ + { + name: "keySelector", + type: "(value: T) => K", + attribute: "", + description: `A function that extracts the key used for grouping for each item.` + }, + { + name: "elementSelector", + type: "((value: T) => R) | void", + attribute: "optional", + description: `A function that extracts the emitted element for each item. Default is identity function.` + }, + { + name: "durationSelector", + type: "(grouped: GroupedObservable) => Observable", + attribute: "optional", + description: `A function that returns an Observable to determine how long each group should exist.` + }, + { + name: "subjectSelector", + type: "() => Subject", + attribute: "optional", + description: `` + } + ], + marbleUrl: "http://reactivex.io/rxjs/img/groupBy.png", + shortDescription: { + description: ` + Group, according to a specified key, elements from items emitted by an Observable, + and emit these grouped items as GroupedObservables, one GroupedObservable per group. + `, + extras: [] + }, + walkthrough: { + description: ` +

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.

+ +

The elements emitted by GroupedObservables are by default the items emitted by the Observable, + or elements returned by the elementSelector function. + ` + }, + examples: [ + { + name: "Group objects by id and return as array", + code: ` + Rx.Observable.of({id: 1, name: 'aze1'}, + {id: 2, name: 'sf2'}, + {id: 2, name: 'dg2'}, + {id: 1, name: 'erg1'}, + {id: 1, name: 'df1'}, + {id: 2, name: 'sfqfb2'}, + {id: 3, name: 'qfs3'}, + {id: 2, name: 'qsgqsfg2'}) + .groupBy(p => p.id) + .flatMap( (group$) => group$.reduce((acc, cur) => [...acc, cur], [])) + .subscribe(p => console.log(p)); + /* + Output: + [ { id: 1, name: 'aze1' }, + { id: 1, name: 'erg1' }, + { id: 1, name: 'df1' } ] + + [ { id: 2, name: 'sf2' }, + { id: 2, name: 'dg2' }, + { id: 2, name: 'sfqfb2' }, + { id: 2, name: 'qsgqsfg2' } ] + + [ { id: 3, name: 'qfs3' } ] + */ + `, + externalLink: { + platform: "JSBin", + url: "http://jsbin.com/buhirolore/1/embed?js,console" + } + }, + { + name: "Pivot data on the id field", + code: ` + Rx.Observable.of({id: 1, name: 'aze1'}, + {id: 2, name: 'sf2'}, + {id: 2, name: 'dg2'}, + {id: 1, name: 'erg1'}, + {id: 1, name: 'df1'}, + {id: 2, name: 'sfqfb2'}, + {id: 3, name: 'qfs1'}, + {id: 2, name: 'qsgqsfg2'}) + .groupBy(p => p.id, p => p.name) + .flatMap( (group$) => group$.reduce((acc, cur) => [...acc, cur], ["" + group$.key])) + .map(arr => ({'id': parseInt(arr[0]), 'values': arr.slice(1)})) + .subscribe(p => console.log(p)); + /* + Output: + { id: 1, values: [ 'aze1', 'erg1', 'df1' ] } + + { id: 2, values: [ 'sf2', 'dg2', 'sfqfb2', 'qsgqsfg2' ] } + + { id: 3, values: [ 'qfs1' ] } + */ + `, + externalLink: { + platform: "JSBin", + url: "http://jsbin.com/zibaharuro/embed?js,console" + } + } + ], + relatedOperators: ["combineAll", "merge", "withLatestFrom"], + additionalResources: [] }; From e2b15d1567765d93876eb29eb41f2541905b2bca Mon Sep 17 00:00:00 2001 From: pmartin Date: Sun, 29 Oct 2017 08:46:19 +0100 Subject: [PATCH 2/2] docs(groupBy): Add Obj definition and GroupedObservable documentation --- src/operator-docs/transformation/groupBy.ts | 17 ++++++++++++++--- 1 file changed, 14 insertions(+), 3 deletions(-) diff --git a/src/operator-docs/transformation/groupBy.ts b/src/operator-docs/transformation/groupBy.ts index a0093988..e20e0c67 100644 --- a/src/operator-docs/transformation/groupBy.ts +++ b/src/operator-docs/transformation/groupBy.ts @@ -50,6 +50,9 @@ export const groupBy: OperatorDoc = {

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. ` @@ -58,6 +61,10 @@ export const groupBy: OperatorDoc = { { name: "Group objects by id and return as array", code: ` + interface Obj { + id: number; + name: string; + } Rx.Observable.of({id: 1, name: 'aze1'}, {id: 2, name: 'sf2'}, {id: 2, name: 'dg2'}, @@ -85,12 +92,16 @@ export const groupBy: OperatorDoc = { `, externalLink: { platform: "JSBin", - url: "http://jsbin.com/buhirolore/1/embed?js,console" + url: "http://jsbin.com/linekelumo/1/embed?js,console" } }, { name: "Pivot data on the id field", code: ` + interface Obj { + id: number; + name: string; + } Rx.Observable.of({id: 1, name: 'aze1'}, {id: 2, name: 'sf2'}, {id: 2, name: 'dg2'}, @@ -114,10 +125,10 @@ export const groupBy: OperatorDoc = { `, externalLink: { platform: "JSBin", - url: "http://jsbin.com/zibaharuro/embed?js,console" + url: "http://jsbin.com/racikizeji/embed?js,console" } } ], - relatedOperators: ["combineAll", "merge", "withLatestFrom"], + relatedOperators: [], additionalResources: [] };