[RxJS] Starting a Stream with SwitchMap & switchMapTo
From an event map to another event we can use switchMap(), switchMap() accept an function which return an obervable.
The following code: When you click the button, it will start a interval to console out the count...
const Observable = Rx.Observable;
const startButton = document.querySelector('#start');
const start$ = Rx.Observable.fromEvent(startButton, 'click');
const interval$ = Observable.interval(400);
const startInterval$ = start$.switchMap( () => {
return interval$;
});
startInterval$.subscribe( (x) => {
console.log(x);
});
So the start$ switch map to a interval$ to avoid writting the nested subscribe function.
switchMap() actually is pretty useful when dealing with http event stream, it can help to cancel the previous http call.
switchMapTo(): which accept an observable:
/*
const startInterval$ = start$.switchMap( () => {
return interval$;
});*/ const startInterval$ = start$.switchMapTo( interval$ );
Tow pieces of code, works the same way.
[RxJS] Starting a Stream with SwitchMap & switchMapTo的更多相关文章
- [RxJS] Toggle A Stream On And Off With RxJS
This lesson covers how to toggle an observable on and off from another observable by showing how to ...
- [RxJS] Stopping a Stream with TakeUntil
Observables often need to be stopped before they are completed. This lesson shows how to use takeUnt ...
- [RxJS] Logging a Stream with do()
To help understand your stream, you’ll almost always want to log out some the intermediate values to ...
- [RxJS] Completing a Stream with TakeWhile
Subscribe can take three params: subscribe( (x)=> console.log(x), err=> console.log(err), ()=& ...
- [RxJS] Implement RxJS `switchMap` by Canceling Inner Subscriptions as Values are Passed Through
switchMap is mergeMap that checks for an "inner" subscription. If the "inner" su ...
- rxjs简单入门
rxjs全名Reactive Extensions for JavaScript,Javascript的响应式扩展, 响应式的思路是把随时间不断变化的数据.状态.事件等等转成可被观察的序列(Obser ...
- RxJS v6 学习指南
为什么要使用 RxJS RxJS 是一套处理异步编程的 API,那么我将从异步讲起. 前端编程中的异步有:事件(event).AJAX.动画(animation).定时器(timer). 异步常见的问 ...
- RxJS——Operators
RxJS 的操作符(operators)是最有用的,尽管 Observable 是最基本的.操作符最基本的部分(pieces)就是以申明的方式允许复杂的异步代码组合简化. 什么是操作符? 操作符是函数 ...
- angular7 Rxjs 异步请求
Promise 和 RxJS 处理异步对比 Promise 处理异步: let promise = new Promise(resolve => { setTimeout(() => { ...
随机推荐
- Codeforces 328A-IQ Test(数列)
A. IQ Test time limit per test 1 second memory limit per test 256 megabytes input standard input out ...
- JS高级程序设计学习笔记之第三章基本概念(语法,数据类型,流控制语句,函数)——查漏补缺
一.语法: 区分大小写; 2.标识符:就是指变量.函数.属性的名字,或者函数的参数 a.标志符的规则:①第一个字符必须是一个字母.下划线(_)或一个美元符号($). ...
- C# 数学运算符
运算符大致分为如下3类: 一元运算符,处理一个操作符 二元运算符,处理两个操作数 三元运算符,处理三个操作数 大多数运算符都是二元运算符,只有几个一元运算符和一个三元运算符,即条件运算符(条件运算符是 ...
- Fragement理解
■ 初衷 可重用,碎片化UI,适应大屏幕pad和小屏幕手机 ■ 优点 自行控制加入,移除,交换. activity则由framework深度掌管. 切换流畅 模块化(逻辑上切割处理) 缺点带来额外 ...
- Linq/List/Array/IEnumerable等集合操作
来源:http://www.cnblogs.com/liushanshan/archive/2011/01/05/1926263.html 目录 1 LINQ查询结果集 1 2 Sy ...
- (原)anaconda 的安装与在pycharm中的版本切换
参考网页: http://continuum.io/blog/anaconda-python-3 http://conda.pydata.org/docs/intro.html#creating-py ...
- SmartQQ二维码登陆接口分析
SmartQQ是腾讯在Web上推出的一款单纯的聊天工具,pc端与移动端都可以访问,接下来具体的分析下登陆流程. 网站:http://w.qq.com/ 工具:这个随意能够看到http数据包就可以,浏览 ...
- WinFrm访问MVC数据
WinFrm使用HttpWebRequest访问MVC中的Controller,以注册为例,客户端输入注册码后点击注册. WinFrm注册代码:代码中使用的是Post提交,UTF8编码方式. priv ...
- Apache之AllowOverride参数详解
通常利用Apache的rewrite模块对 URL 进行重写的时候, rewrite规则会写在 .htaccess 文件里.但要使 apache 能够正常的读取.htaccess 文件的内容,就必须对 ...
- python文件_读取
1.文件的读取和显示 方法1: f=open(r'G:\2.txt') print f.read() f.close() 方法2: try: t=open(r'G:\2.txt') print t.r ...