[RxJS] Handling a Complete Stream with Reduce
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的更多相关文章
- 【Java 8】Stream通过reduce()方法合并流为一条数据示例
在本页中,我们将提供 Java 8 Stream reduce()示例. Stream reduce()对流的元素执行缩减.它使用恒等式和累加器函数进行归约. 在并行处理中,我们可以将合并器函数作为附 ...
- java 数据类型:集合接口Collection之 Stream 的reduce方法
Stream 的reduce递归计算 import java.util.ArrayList; import java.util.Arrays; import java.util.List; impor ...
- [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 ...
- Stream中reduce()使用记录
一.reduce()使用1.第一个参数是我们给出的初值,2.第二个参数是累加器,可以自己用实现接口完成想要的操作,这里使用Bigdecimal的add方法 3.最后reduce会返回计算后的结果 Bi ...
- [RxJS] Observables can complete
The Observer object has the functions next() and error(). In this lesson we will see the other (and ...
- [RxJS] Handling Multiple Streams with Merge
You often need to handle multiple user interactions set to different streams. This lesson shows hows ...
- [五]java函数式编程归约reduce概念原理 stream reduce方法详解 reduce三个参数的reduce方法如何使用
reduce-归约 看下词典翻译: 好的命名是自解释的 reduce的方法取得就是其中归纳的含义 java8 流相关的操作中,我们把它理解 "累加器",之所以加引号是因为他并不仅仅 ...
- RxJS入门
一.RxJS是什么? 官方文档使用了一句话总结RxJS: Think of RxJS as Lodash for events.那么Lodash主要解决了什么问题?Lodash主要集成了一系列关于数组 ...
- Upgrading to Java 8——第四章 The Stream API
在这章中我们将学习Stream API,在JDK 8 中的一项新的特性.为了理解这一章的主题,你需要知道如何使用Lambda表达式和java.util.function里的预定义的函数式接口. 一个S ...
随机推荐
- hdu5067Harry And Dig Machine(TSP旅行商问题)
题目链接: huangjing 题意:给出一幅图.图中有一些点,然后从第1个点出发,然后途径全部有石头的点.最后回到原点,然后求最小距离.当初作比赛的时候不知道这就是旅行商经典问题.回来学了一下. 思 ...
- Java 动态代理机制详解(JDK 和CGLIB,Javassist,ASM)
class文件简介及加载 Java编译器编译好Java文件之后,产生.class 文件在磁盘中.这种class文件是二进制文件,内容是只有JVM虚拟机能够识别的机器码.JVM虚拟机读取字节码文件,取出 ...
- Python代码分析工具之dis模块
转自:http://hi.baidu.com/tinyweb/item/923d012e8146d00872863ec0 ,格式调整过. 代码分析不是一个新的话题,代码分析重要性的判断比较主观,不同 ...
- 毕业设计 ASP.Net+EasyUI开发 X X露天矿调度管理信息系统(二)
这是本毕业设计的雏形和框架,实现的功能在左侧的功能框导航菜单内. 做的太烂,还是把学校名字给马赛克掉吧....省的挨校友批 登陆界面.. <cookie +ispostback实现记住我功能& ...
- js 判断微信浏览器(转)
最近做很多HTML5的项目,很多页面会通过微信微博等SNS分享出去.在分享页面上提供公司APP的下载.但是在很多应用的浏览器中,点击下载链接无法下载应用.那么针对这些浏览器我们需要给用户提示从safa ...
- (转)ip地址,手机ip查询
页面地址:http://www.ip138.com/ 外链地址(实际主页面里面有)http://www.ip138.com/iplink.htm 外链地址里面的内容: <FORM METHOD= ...
- 一些小trick~
做质因子分解的时候将先打素数表会节省很多时间
- [Mugeda HTML5技术教程之1] HTML5: 生存还是毁灭
[Mugeda HTML5技术教程] 开篇: HTML5 - 生存,还是毁灭 摘要:HTML5并不试图解决所有问题.但是在很多适合的场合,HTML5是不二选择. To be, or not to be ...
- 转载:css3 box-shadow投影发光效果
转载网址:http://www.wufangbo.com/css3-box-shadow/ CSS3的box-shadow属性 可以让我们轻松实现图层阴影效果.我们来实战详解一下这个属性. 1. bo ...
- 《图解CSS3》——笔记(二)
作者:大漠 勘误:http://www.w3cplus.com/book-comment.html 2014年7月15日15:58:11 第二章 CSS3选择器 2.1 认识CSS选择器 2.1. ...