[RxJS] Use groupBy in real RxJS applications
in use Rxjs Real Applications GroupBy
2023-09-14 09:00:52 时间
This lesson will show when to apply groupBy in the real world. This RxJS operator is best suited when a source observable represents many data sources, e.g. an observable for multitouch events.
const busObservable = Rx.Observable.of( {code: 'en-us', value: '-TEST-'}, {code: 'en-us', value: 'hello'}, {code: 'es', value: '-TEST-'}, {code: 'en-us', value: 'amazing'}, {code: 'pt-br', value: '-TEST-'}, {code: 'pt-br', value: 'olá'}, {code: 'es', value: 'hola'}, {code: 'es', value: 'mundo'}, {code: 'en-us', value: 'world'}, {code: 'pt-br', value: 'mundo'}, {code: 'es', value: 'asombroso'}, {code: 'pt-br', value: 'maravilhoso'} ).concatMap(x => Rx.Observable.of(x).delay(500)); const all = busObservable .groupBy(obj => obj.code) // 2-d obs .mergeMap(innerObs => innerObs.skip(1).map(obj => obj.value)); all.subscribe(x => console.log(x));
/* "hello" "amazing" "olá" "hola" "mundo" "world" "mundo" "asombroso" "maravilhoso" */
- The 'groupBy' return a 2-d observable, can use 'switchMap' or 'mergeMap' to conver to 1-d observable.
相关文章
- js的for in具有不适应性(转)
- [Typescript] Use the Nullish Coalescing Operator in TypeScript (isNil)
- [Bash] Chain Commands with Pipes and Redirect Output in Bash
- [Kotlin] Catch Error in Java
- [React] Use Async Functions in a Recoil Selector
- [Ramda] Lens in Depth
- [Javascript] Use JavaScript's for-in Loop on Objects with Prototypes
- [Nuxt] Use Vuex Actions to Delete Data from APIs in Nuxt and Vue.js
- [React] Update Component State in React With Ramda Lenses
- [RxJS] Use groupBy in real RxJS applications
- Use View.isInEditMode() in your custom views to skip code when shown in Eclipse
- [Typescript] Use Generics in a Reduce Function
- [XState] Use Internal Transitions in XState to Avoid State Exit and Re-Entry
- [Functional Programming] Capture Side Effects in a Task / Async
- [React] PureComponent in React
- [Typescript Kaop-ts] Use AOP in Vue Components with TypeScript and Kaop-ts
- [Javascript] Deep Search nested tag element in DOM tree
- [SCSS] Use Standard Built-in SCSS Functions for Common Operations
- [Vue] Conditionally Render DOM Elements in Vue.js (v-if v-else v-show)
- 【转】You Can Now Use OneDrive in Linux Natively Thanks to Insync
- Known issue of saved query in Lead application
- how to use object based exception combined with message class in SE91
- How product extension field is involved in search scenario
- How to use filter in Analytics Path Framework
- 在AS上导入第三方module项目后报错提示:Resource IDs cannot be used in a switch statement in Android library modules
- inconsistent use of tabs and spaces in indentation
- 解决 java.sql.SQLSyntaxErrorException:Unknown column ‘xxx‘ in ‘field list‘的问题
- How to resolve unassigned shards in Elasticsearch——写得非常好