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. docker 深入理解之cgroups

    cgroups 资源限制 cgroups 是什么 cgroups 最初名为process container,有Google工程师Paul Menage和Rohit Seth于 2006 年提出,后由 ...

  2. Bug的分类和管理流程

    1.按照严重程度划分 定义:是指Bug对软件质量的破坏程度,即BUG的存在将对软件的功能和性能产生怎样的影响 分类:系统崩溃.严重.一般.次要.建议 2.按优先级划分 定义:表示处理和修正软件缺陷的现 ...

  3. CAD交互绘制带颜色宽度的直线(网页版)

    用户可以在CAD控件视区任意位置绘制直线. 主要用到函数说明: _DMxDrawX::DrawLine 绘制一个直线.详细说明如下: 参数 说明 DOUBLE dX1 直线的开始点x坐标 DOUBLE ...

  4. AspNetCore容器化(Docker)部署(一) —— 入门

    一.docker注册安装 Windows Docker Desktop https://www.docker.com/products/docker-desktop Linux Docker CE h ...

  5. EBS ORACLE工单齐套率的计算程序

    PROCEDURE Get_wip_accept_item_date(p_use_id in number, p_org_id IN NUMBER, p_start_date IN DATE, p_e ...

  6. ios operationqueue

    http://www.hrchen.com/2013/06/multi-threading-programming-of-ios-part-2/

  7. 【牛客练习赛 25】A 因数个数和

    题目地址:https://www.nowcoder.com/acm/contest/158/A 参考博客:https://blog.csdn.net/zzcblogs/article/details/ ...

  8. MongoDB中导入数据命令的使用(mongoimport)

    MongoDB中导入数据命令的使用(mongoimport) 制作人:全心全意 语法: mongoimport <options> <file> 介绍: 该命令可以将CSV,T ...

  9. tensorflow with gpu 环境配置

    1.准备工作 1.1 确保GPU驱动已经安装 lspci | grep -i nvidia 通过此命令可以查看GPU信息,测试机已经安装GPU驱动

  10. [第一波模拟\day2\T1] {病毒分裂}(split.cpp)

    [题目描述] A 学校的实验室新研制出了一种十分厉害的病毒.由于这种病毒太难以人工制造了,所以专家们在一开始只做出了一个这样的病毒.这个病毒被植入了特殊的微型芯片,使其可以具有一些可编程的特殊性能.最 ...