When a stream has completed, you often need to evaluate everything that has happened while the stream was running. This lesson covers how to use reduce to collect values and total up a “score” of this simple game.

const Observable = Rx.Observable;

const startButton = document.querySelector('#start');
const halfButton = document.querySelector('#half');
const quarterButton = document.querySelector('#quarter'); const stopButton = document.querySelector('#stop');
const resetButton = document.querySelector('#reset'); const input = document.querySelector('#input'); const start$ = Observable.fromEvent(startButton, 'click');
const half$ = Observable.fromEvent(halfButton, 'click');
const quarter$ = Observable.fromEvent(quarterButton, 'click'); const stop$ = Observable.fromEvent(stopButton, 'click');
const reset$ = Observable.fromEvent(resetButton, 'click'); const input$ = Observable.fromEvent(input, 'input')
.map(event => event.target.value); const data = {count:};
const inc = (acc)=> ({count: acc.count + });
const reset = (acc)=> data; const starters$ = Observable.merge(
start$.mapTo(),
half$.mapTo(),
quarter$.mapTo()
); const intervalActions = (time)=> Observable.merge(
Observable.interval(time)
.takeUntil(stop$).mapTo(inc),
reset$.mapTo(reset)
); const timer$ = starters$
.switchMap(intervalActions)
.startWith(data)
.scan((acc, curr)=> curr(acc)) Observable.combineLatest(
timer$,
input$,
(timer, input)=> ({count: timer.count, text: input})
)
.takeWhile((data)=> data.count <= )
.filter((data)=> data.count === parseInt(data.text))
.reduce((acc, curr)=> acc + , ) //count how many times it go thought filter
.subscribe(
(x)=> console.log(x),
err=> console.log(err),
()=> console.log('complete')
);

[RxJS] Handling a Complete Stream with Reduce的更多相关文章

  1. 【Java 8】Stream通过reduce()方法合并流为一条数据示例

    在本页中,我们将提供 Java 8 Stream reduce()示例. Stream reduce()对流的元素执行缩减.它使用恒等式和累加器函数进行归约. 在并行处理中,我们可以将合并器函数作为附 ...

  2. java 数据类型:集合接口Collection之 Stream 的reduce方法

    Stream 的reduce递归计算 import java.util.ArrayList; import java.util.Arrays; import java.util.List; impor ...

  3. [RxJS] Resubscribing to a Stream with Repeat

    When you complete a stream, there’s no way to restart it, you must resubscribe. This lesson shows ho ...

  4. Stream中reduce()使用记录

    一.reduce()使用1.第一个参数是我们给出的初值,2.第二个参数是累加器,可以自己用实现接口完成想要的操作,这里使用Bigdecimal的add方法 3.最后reduce会返回计算后的结果 Bi ...

  5. [RxJS] Observables can complete

    The Observer object has the functions next() and error(). In this lesson we will see the other (and ...

  6. [RxJS] Handling Multiple Streams with Merge

    You often need to handle multiple user interactions set to different streams. This lesson shows hows ...

  7. [五]java函数式编程归约reduce概念原理 stream reduce方法详解 reduce三个参数的reduce方法如何使用

    reduce-归约 看下词典翻译: 好的命名是自解释的 reduce的方法取得就是其中归纳的含义 java8 流相关的操作中,我们把它理解 "累加器",之所以加引号是因为他并不仅仅 ...

  8. RxJS入门

    一.RxJS是什么? 官方文档使用了一句话总结RxJS: Think of RxJS as Lodash for events.那么Lodash主要解决了什么问题?Lodash主要集成了一系列关于数组 ...

  9. Upgrading to Java 8——第四章 The Stream API

    在这章中我们将学习Stream API,在JDK 8 中的一项新的特性.为了理解这一章的主题,你需要知道如何使用Lambda表达式和java.util.function里的预定义的函数式接口. 一个S ...

随机推荐

  1. hdu5067Harry And Dig Machine(TSP旅行商问题)

    题目链接: huangjing 题意:给出一幅图.图中有一些点,然后从第1个点出发,然后途径全部有石头的点.最后回到原点,然后求最小距离.当初作比赛的时候不知道这就是旅行商经典问题.回来学了一下. 思 ...

  2. Java 动态代理机制详解(JDK 和CGLIB,Javassist,ASM)

    class文件简介及加载 Java编译器编译好Java文件之后,产生.class 文件在磁盘中.这种class文件是二进制文件,内容是只有JVM虚拟机能够识别的机器码.JVM虚拟机读取字节码文件,取出 ...

  3. Python代码分析工具之dis模块

    转自:http://hi.baidu.com/tinyweb/item/923d012e8146d00872863ec0  ,格式调整过. 代码分析不是一个新的话题,代码分析重要性的判断比较主观,不同 ...

  4. 毕业设计 ASP.Net+EasyUI开发 X X露天矿调度管理信息系统(二)

    这是本毕业设计的雏形和框架,实现的功能在左侧的功能框导航菜单内.  做的太烂,还是把学校名字给马赛克掉吧....省的挨校友批 登陆界面.. <cookie +ispostback实现记住我功能& ...

  5. js 判断微信浏览器(转)

    最近做很多HTML5的项目,很多页面会通过微信微博等SNS分享出去.在分享页面上提供公司APP的下载.但是在很多应用的浏览器中,点击下载链接无法下载应用.那么针对这些浏览器我们需要给用户提示从safa ...

  6. (转)ip地址,手机ip查询

    页面地址:http://www.ip138.com/ 外链地址(实际主页面里面有)http://www.ip138.com/iplink.htm 外链地址里面的内容: <FORM METHOD= ...

  7. 一些小trick~

    做质因子分解的时候将先打素数表会节省很多时间

  8. [Mugeda HTML5技术教程之1] HTML5: 生存还是毁灭

    [Mugeda HTML5技术教程] 开篇: HTML5 - 生存,还是毁灭 摘要:HTML5并不试图解决所有问题.但是在很多适合的场合,HTML5是不二选择. To be, or not to be ...

  9. 转载:css3 box-shadow投影发光效果

    转载网址:http://www.wufangbo.com/css3-box-shadow/ CSS3的box-shadow属性 可以让我们轻松实现图层阴影效果.我们来实战详解一下这个属性. 1. bo ...

  10. 《图解CSS3》——笔记(二)

    作者:大漠 勘误:http://www.w3cplus.com/book-comment.html 2014年7月15日15:58:11 第二章  CSS3选择器 2.1  认识CSS选择器 2.1. ...