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

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

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

  3. 条目二十四《当效率至关重要时,请在map::operator[]与map::insert之间谨慎做出选择》

    条目二十四<当效率至关重要时,请在map::operator[]与map::insert之间谨慎做出选择> 当效率至关重要时,应该在map::operator[]和map::insert之 ...

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

  5. Implement Hash Map Using Primitive Types

    A small coding test that I encountered today. Question Using only primitive types, implement a fixed ...

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

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

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

随机推荐

  1. Hibernate-02 HQL实用技术

    学习任务 Query接口的使用 HQL基本用法 动态参数绑定查询 HQL的使用 Hibernate支持三种查询方式:HQL查询.Criateria查询.Native SQL查询. HQL是Hibern ...

  2. Java编程:常见问题汇总

    每天在写Java程序,其实里面有一些细节大家可能没怎么注意,这不,有人总结了一个我们编程中常见的问题.虽然一般没有什么大问题,但是最好别这样做. AD: 每天在写Java程序,其实里面有一些细节大家可 ...

  3. HLS协议详解

    1. HLS HLS是为移动设备开发的基于HTTP的流媒体解决方案. 2. 原理: 将视频或流切分成小片(TS), 并建立索引(M3U8). 支持视频流:H.264: 音频流:AAC 3. M3U8文 ...

  4. IOS学习笔记2—Objective C—类、属性、方法

    以下是我学习IOS开发的一些笔记和心得,贴出来和大家一同分享,也希望大家能补充和纠错,共同进步 有Android和IOS开发问题也希望能和大家交流! Objective-C 1.OC是一门基于C的面向 ...

  5. 用Jenkins构建项目实战

    登录Jenkins,新建任务 输入一个任务名称,选择一个项目类型 使用自定义工作空间:使该项目独立于系统的工作空间 自动从Git下载源码,点击添加可以增加凭证 日程表的参数: 第一个参数代表的是分钟 ...

  6. python TCP协议详解 三次握手四次挥手和11种状态

    11种状态解析 LISTEN  --------------------  等待从任何远端TCP 和端口的连接请求. SYN_SENT  ---------------  发送完一个连接请求后等待一个 ...

  7. QEMU支持的几种常见的镜像文件格式

    qemu-img支持非常多种的文件格式,可以通过"qemu-img  -h"查看其命令帮助得到,它支持二十多种格式:blkdebug.blkverify.bochs.cloop.c ...

  8. 学习vue之windows下安装live-server 超级详细篇

    最近项目要求用vue2.0所以开始着手学习. 前期准备: 下载Node.js 地址:http://nodejs.cn/download/ 选择自己对应的版本,我下载的是.msi 64位的 然后就双击下 ...

  9. 十二.GUI

    tkinter模块(tkinter是一个跨平台的PythonGUI工具包): #Tkinter是一个跨平台的Python GUI工具包 import tkinter top=tkinter.Tk() ...

  10. solr 时区问题

    本人使用solr版本5.0.0,使用jetty启动 solr默认UTC时区,与我们相差八小时,按照网络上资料修改 C:\Users\hp\Desktop\solr-5.0.0\bin 下的solr.i ...