[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" subscription exists, switchMap
unsubscribes from that "inner" subscription which effectively "cancels" any pending pushes.
import { fromEvent, of, Subscriber } from "rxjs"
import {
scan,
delay,
mergeMap,
switchMap
} from "rxjs/operators" class MySwitchMapSubscriber extends Subscriber {
innerSubscription constructor(sub, fn) {
super(sub) this.fn = fn
} _next(value) {
console.log(`outer`, value)
const o$ = this.fn(value) if (this.innerSubscription) {
this.innerSubscription.unsubscribe()
} this.innerSubscription = o$.subscribe({
next: value => {
console.log(` inner`, value)
this.destination.next(value)
}
})
}
} const mySwitchMap = fn => source =>
source.lift({
call(sub, source) {
source.subscribe(
new MySwitchMapSubscriber(sub, fn)
)
}
}) const observable$ = fromEvent(
document,
"click"
).pipe(
scan(i => i + , ),
mySwitchMap(value => of(value).pipe(delay()))
) const subscriber = {
next: value => {
console.log(value)
},
complete: () => {
console.log("done")
},
error: value => {
console.log(value)
}
} observable$.subscribe(subscriber)
[RxJS] Implement RxJS `switchMap` by Canceling Inner Subscriptions as Values are Passed Through的更多相关文章
- [RxJS] Implement RxJS `concatMap` by Waiting for Inner Subscriptions to Complete
Unlike mergeMap and switchMap, concatMap focuses on when "inner" subscriptions "compl ...
- [RxJS] Implement RxJS `mergeMap` through inner Observables to Subscribe and Pass Values Through
Understanding sources and subscribers makes it much easier to understand what's going on with mergeM ...
- [RxJS] Implement the `map` Operator from Scratch in RxJS
While it's great to use the RxJS built-in operators, it's also important to realize you now have the ...
- [RxJS] exhaustMap vs switchMap vs concatMap
exhaustMap: It drop the outter observable, just return the inner observable, and it waits until prev ...
- [RxJS] Implement pause and resume feature correctly through RxJS
Eventually you will feel the need for pausing the observation of an Observable and resuming it later ...
- [RxJS] Use RxJS concatMap to map and concat high order observables
Like switchMap and mergeMap, concatMap is a shortcut for map() followed by a concatAll(). In this le ...
- [RxJS] Use RxJS mergeMap to map and merge high order observables
Like RxJS switchMap() is a shortcut for map() and switch(), we will see in this lesson how mergeMap( ...
- [RxJS] Chain RxJS Operators Together with a Custom `pipe` Function using Array.reduce
Instead of writing complex operators, it's usually best to write simple, single-purpose operators th ...
- [RxJS] Convert RxJS Subjects to Observables
The use of RxJS Subjects is common, but not without problems. In this lesson we will see how they ca ...
随机推荐
- PRJ0003 : Error spawning 'midl.exe'
原因:出现该错误的是由于:C:\Program Files\Microsoft SDKs\Windows\v6.0A midl.exe 和midlc.exe缺失. 解决方法:从别人电脑上拷贝这个两个文 ...
- 微信小程序---协同工作和发布
(1)协同开发和发布 在中大型的公司里,人员的分工非常仔细,一般会有不同岗位角色的员工同时参与同一个小程序项目.为此,小程序平台设计了不同的权限管理使得项目管理者可以更加高效管理整个团队的协同工作. ...
- AspNetCore容器化(Docker)部署(四) —— Jenkins自动化部署
一.前言 (Jenkins.Docker.Git/Svn组建一套简单的自动化发布流程) 文章中用到的相关服务器角色 角色 环境 功能 开发机 Win10.Docker(Linux OS) 编码.调试 ...
- POJ-1190-生日蛋糕(深搜,剪枝)
生日蛋糕 Time Limit: 1000MS Memory Limit: 10000K Total Submissions: 23049 Accepted: 8215 Description 7月1 ...
- Python机器学习2.2
使用Python实现感知器学习算法 在<Python机器学习>中的2.2节中,创建了罗森布拉特感知器的类,通过fit方法初始化权重self.w_,再fit方法循环迭代样本,更新权重,使用p ...
- (十九)python 3 内嵌函数和闭包
内嵌函数:函数里又嵌套一个函数 def fun1(): print('fun1()在被调用') def fun2(): print('fun2()在被调用') fun2() 闭包: 闭包是函数里面嵌套 ...
- STM32--TIM定时器时钟分割(疑难)
不太明白 (1) TIM_Perscaler来设置预分频系数: (2) TIM_ClockDivision来设置时钟分割(时钟分频因子): (3) TIM_C ...
- 安装MySQL for Windows 数据库
在官网下载MySql数据库windows版本:http://dev.mysql.com/downloads/file/?id=459075 下载到本地解压出来,如下图: 复制上面目录下的my-defa ...
- 数列分块入门1~9 loj6277~6285
hzwer的讲解 一 给出一个长为 \(n\) 的数列,以及 \(n\) 个操作,操作涉及区间加法,单点查值. #include <iostream> #include <cstdi ...
- mysql异常Incorrect string value: '\xE6\xB5\x8B\xE8\xAF\x95' for column 'region_name'
Incorrect string value: '\xE6\xB5\x8B\xE8\xAF\x95' for column 'region_name' insert语句加的该字段有汉字,乱码造成的 解 ...