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的更多相关文章

  1. [RxJS] Implement RxJS `concatMap` by Waiting for Inner Subscriptions to Complete

    Unlike mergeMap and switchMap, concatMap focuses on when "inner" subscriptions "compl ...

  2. [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 ...

  3. [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 ...

  4. [RxJS] exhaustMap vs switchMap vs concatMap

    exhaustMap: It drop the outter observable, just return the inner observable, and it waits until prev ...

  5. [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 ...

  6. [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 ...

  7. [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( ...

  8. [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 ...

  9. [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 ...

随机推荐

  1. 使用Spring AOP切面解决数据库读写分离

    http://blog.jobbole.com/103496/ 为了减轻数据库的压力,一般会使用数据库主从(master/slave)的方式,但是这种方式会给应用程序带来一定的麻烦,比如说,应用程序如 ...

  2. Vickers Vane Pump Tips - Vane Pump Maintenance Note

    The    Vickers Vane Pump    describes the matters needing attention in the maintenance of the vane p ...

  3. java中的编译时与运行时

    ----?基础知识   -- 编译时 编译器将源代码翻译成机器能够读懂的代码,如java中就是翻译成jvm能够读懂的字节码文件.简单说,编译时就是机器帮我们检查代码是否有出现语法错误,关键字写错之类的 ...

  4. (8) openssl rsautl(签名/验证签名/加解密文件)和openssl pkeyutl(文件的非对称加密)

    rsautl是rsa的工具,相当于rsa.dgst的部分功能集合,可用于生成数字签名.验证数字签名.加密和解密文件. pkeyutl是非对称加密的通用工具,大体上和rsautl的用法差不多,所以此处只 ...

  5. 如何将已经安装从chrome扩展程序导出备份为.CRX文件?

    之前介绍过CRX Extractor可以从chrome应用商店下载备份扩展程序,有读者朋友问说:如果 Google Chrome扩展程序已经从 Chrome应用商店下架,还有没有方法下载呢?通常网路上 ...

  6. 我的java web之路(安装)

    所有的软件下载完,陪完jdk之后,迎来了一系列的安装工作... 1.安装SQL Server 2005 首先,打开ISS功能,控制面板->程序->打开或关闭windows功能 注意红框内的 ...

  7. 如何查看Laravel版本号的三种方法

    1.PHP artisan --version 2.vim vendor/laravel/framework/src/Illuminate/Foundation/Application.php 3:可 ...

  8. jenkins里跑selenium webdriver,Chrome浏览器不能打开&&unknown error: unable to discover open pages

    在windows的cmd里面执行 “python test.py”,毫无问题,浏览器正常打开,测试结果也正常. 问题: 但如果是在jenkins里,选择 “execute windows batch ...

  9. 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语句加的该字段有汉字,乱码造成的 解 ...

  10. Action中result的各种转发类型

    Action中result的各种转发类型 1,dispatcher:默认值 ,内部定向 <result>/WEB-INF/page/employeeAdd.jsp</result&g ...