[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(() => { ...
随机推荐
- div与span
div与span的区别: div标签属于块级元素,span标签属于行内元素,使用对比效果如下: <!DOCTYPE html> <html> <head lang=&qu ...
- oracle数据库exp/imp命令详解
转自http://wenku.baidu.com/link?url=uD_egkkh7JtUYJaRV8YM6K8CLBT6gPJS4UlSy5WKhz46D9bnychTPdgJGd7y6UxYtB ...
- java 修改文件名
// 修改文件名 public static boolean modifyFileName(String serverPath, String oldFileName, String newLogin ...
- Struts2:ValueStack
一.ValueStack 1 .ValueStack是一个接口,在struts2中使用OGNL(Object-Graph Navigation Language)表达式实际上是使用 ...
- C++中的析构函数
代码: #include <cstdio> #include <iostream> using namespace std; class A{ public: ~A(){ co ...
- CODEVS 1287 矩阵乘法
1287 矩阵乘法 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题目描述 Description 小明最近在为线性代数而头疼,线性代数确实很抽象(也很无聊) ...
- 转载:css3 box-shadow投影发光效果
转载网址:http://www.wufangbo.com/css3-box-shadow/ CSS3的box-shadow属性 可以让我们轻松实现图层阴影效果.我们来实战详解一下这个属性. 1. bo ...
- linux下环境搭建比较
xampp是一款初学者使用的集成的apache mysql与php配置安装包了,我们可以利用xampp来快速安装配置php环境,下面一起来看看吧. 要在linux服务器上面挂我们的php网站程序, ...
- instanceof操作符判断对象类型
instanceof 的语法格式如下: myobject instanceof ExampleClass myobject:某类的对象引用 ExampleClass:某个类 class Quadran ...
- android ioctl fuzz,android 本地提权漏洞 android root
目前正在研究android 三方设备驱动 fuzzer , 也就是下图所说的 ioctl fuzzing, 下图是由keen team nforest 大神发布: 欢迎正在研究此方面的人联系我共同交流 ...