[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 knowledge to write them by yourself if needed. The mapoperator turns out to be a simple MapSubscriber which takes a function and applies it to the value passed to next.
map.js:
import { Subscriber } from "rxjs";
class MapSubscriber extends Subscriber {
constructor(sub, fn) {
super(sub);
this.fn = fn;
}
_next(value) {
this.destination.next(this.fn(value));
}
}
export const map = fn => source =>
source.lift({
call(sub, source) {
source.subscribe(new MapSubscriber(sub, fn));
}
});
multiply.js:
import { map } from "./map";
export const mul = number => map(v => v * number);
index.js:
import { from, Subscriber } from "rxjs";
import { multiply, mul } from "./multiply";
const observable$ = from([, , , , ]);
const subscriber = {
next: value => {
console.log(value);
},
complete: () => {
console.log("done");
},
error: value => {
console.log(value);
}
};
observable$.pipe(mul()).subscribe(subscriber);
observable$.pipe(mul()).subscribe(subscriber);
[RxJS] Implement the `map` Operator from Scratch in RxJS的更多相关文章
- [RxJS] Create a Reusable Operator from Scratch in RxJS
With knowledge of extending Subscriber and using source.lift to connect a source to a subscriber, yo ...
- [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 ...
- 条目二十四《当效率至关重要时,请在map::operator[]与map::insert之间谨慎做出选择》
条目二十四<当效率至关重要时,请在map::operator[]与map::insert之间谨慎做出选择> 当效率至关重要时,应该在map::operator[]和map::insert之 ...
- [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 ...
- Implement Hash Map Using Primitive Types
A small coding test that I encountered today. Question Using only primitive types, implement a fixed ...
- [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] 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( ...
- [Javascript + rxjs] Using the map method with Observable
Like an array, Observable has a map method that allows us to transform a sequence into a new Observa ...
- [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 ...
随机推荐
- vscode 打开新文件不替换旧文件
设置 "workbench.editor.enablePreview": false
- 样式化复选框(Styling Checkbox)
原理:https://www.tuicool.com/articles/y67jee 表现:http://www.freejs.net/demo/381/index.html https://www. ...
- 解决for循环下变量显示一致的问题
for(var i=0;i<10;i++){ setTimeOut(function(){ console.log("i:",i); },100) } 上面显示的打印出来结果 ...
- mysql创建新用户
如果你需要添加 MySQL 用户,你只需要在 mysql 数据库中的 user 表添加新用户即可. 以下为添加用户的的实例,用户名为qi,密码为python,并授权用户可进行SELECT,INSERT ...
- 尺取法 || POJ 2739 Sum of Consecutive Prime Numbers
给一个数 写成连续质数的和的形式,能写出多少种 *解法:先筛质数 然后尺取法 **尺取法:固定区间左.右端点为0,如果区间和比目标值大则右移左端点,比目标值小则右移右端点 ...
- python之道03
1.有变量name = " aleX leNb " 完成如下操作: 移除 name 变量对应的值两边的空格,并输出处理结果 答案: name = " aleX leNb ...
- ssh和sshd服务
1.1 对称加密和非对称加密 对称加密:加密和解密使用一样的算法,只要解密时提供与加密时一致的密码就可以完成解密.例如QQ登录密码,银行卡密码,只要保证密码正确就可以. 非对称加密:通过公钥(publ ...
- log4j 、logback 以及slf4j三者之间的关系
在项目的开发中由于对于log4j.logback以及slf4j之间的关系和相关的知识不能清晰掌握,在业余时间进行记录. 1.三者之间的关系 1) 简答的讲就是slf4j是一系列的日志接口,而log4j ...
- pycharm配置git--图文教程
1. 下载git客户端 2. File->Default Setting-> Version Control->Git 3. Path to Git exec ...
- python017 Python3 模块
Python3 模块在前面的几个章节中我们脚本上是用 python 解释器来编程,如果你从 Python 解释器退出再进入,那么你定义的所有的方法和变量就都消失了.为此 Python 提供了一个办法, ...