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()); const all = busObservable
.groupBy(obj => obj.code) // 2-d obs
.mergeMap(innerObs => innerObs.skip().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.

[RxJS] Use groupBy in real RxJS applications的更多相关文章

  1. [RxJS + AngularJS] Sync Requests with RxJS and Angular

    When you implement a search bar, the user can make several different queries in a row. With a Promis ...

  2. [RxJS] Refactoring Composable Streams in RxJS, switchMap()

    Refactoring streams in RxJS is mostly moving pieces of smaller streams around. This lessons demonstr ...

  3. [RxJS] Reactive Programming - Why choose RxJS?

    RxJS is super when dealing with the dynamic value. Let's see an example which not using RxJS: var a ...

  4. [RxJS] Learn How To Use RxJS 5.5 Beta 2

    The main changes is about how you import rxjs opreators from now on. And introduce lettable opreator ...

  5. [rxjs] Creating An Observable with RxJS

    Create an observable var Observable = Rx.Observable; var source = Observable.create(function(observe ...

  6. [RxJS] Reactive Programming - What is RxJS?

    First thing need to understand is, Reactive programming is dealing with the event stream. Event stre ...

  7. [RxJS] Split an RxJS Observable into groups with groupBy

    groupBy() is another RxJS operator to create higher order observables. In this lesson we will learn ...

  8. [转]VS Code 扩展 Angular 6 Snippets - TypeScript, Html, Angular Material, ngRx, RxJS & Flex Layout

    本文转自:https://marketplace.visualstudio.com/items?itemName=Mikael.Angular-BeastCode VSCode Angular Typ ...

  9. rxjs的世界

    rxjs学习了几个月了,看了大量的东西,在理解Observable的本文借鉴的是渔夫的故事,原文,知识的主线以<深入浅出rxjs>为主,动图借鉴了rxjs中文社区翻译的文章和国外的一个动图 ...

随机推荐

  1. Mysql 简介二

    Mysql 数据库引擎: 数据库引擎是用于存储.处理和保护数据的核心服务 Mysql支持的引擎一般有这几种: MyISAM Mysql 5.1版本之前默认的存储引擎,仅仅支持表锁,但查询速度较Inno ...

  2. 【Codeforces Round #453 (Div. 2) B】Coloring a Tree

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 从根节点开始. 显然它是什么颜色.就要改成对应的颜色.(如果上面已经有某个点传了值就不用改 然后往下传值. [代码] #includ ...

  3. 《开源公开课分享》:Java开源框架案例分享

        缺乏高端技术人才?缺乏开发标准?    代码复用性低?技术风险难于把控?     招聘成本高?培训成本高?    假设想法不够雄伟,那么就会局限于细节:假设一開始就铺很大的摊子,将会失去控制: ...

  4. 设计模式之十二:状态模式(State)

    状态模式: 当一个对象的内部状态发生变化时同意改变它的行为. Allow an object to alter its behavior when its internal state changes ...

  5. scrapy-加蘑菇代理

    加代理ip     隧道代理 setting中 解开  下载器 

  6. 微信小程序图片使用示例

    小程序官方API:https://developers.weixin.qq.com/miniprogram/dev/component/image.html 1:加载本地文件夹图片 <image ...

  7. js中#代表什么

    js中#代表什么 一.总结 1.#号:代表id选择器  2. $('#div1'). : 常用用法,前面也有$符号 二."#"在js中代表什么 js里我不曾看到用到‘#’的代码端, ...

  8. Altium Designer如何调整鼠标形状

    在 里面有一个

  9. SOAP消息结构

    邵盛松 2012-5-22 一 SOAP消息结构 SOAP消息包括以下元素 必需的 Envelope 元素,可把此 XML 文档标识为一条 SOAP 消息,XML文件的顶层元素,代表该文件为SOAP消 ...

  10. 【例题 6-13 UVA - 1103】Ancient Messages

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 每个图案里面的"洞"的个数都是不同的. 则可以根据这个判别每个图像是什么. 先用dfs确定轮廓之后. 再从每个白 ...