[RxJS] Use `lift` to Connect a `source` to a `subscriber` in RxJS
The lift method on each source hides away the internals of RxJS so you can simply connect a source to the subscriber you're working with. The lift method take an object with a call function with subscriber and source arguments, then it's up to you how you want to connect them together.
Previous we created a custom subscriber, we do it in subscribe() function:
import { from, Subscriber } from "rxjs";
const observable$ = from([1, 2, 3, 4, 5]);
const subscriber = {
next: value => {
console.log(value);
},
complete: () => {
console.log("done");
},
error: value => {
console.log(value);
}
};
class DoulbeSubscriber extends Subscriber {
_next(value) {
this.destination.next(value * 2);
}
}
observable$.subscribe(new DoulbeSubscriber(subscriber));
Of course it isn't ideal to do the transformation in subscriber.
Better way is that we can do though `pipe`, create a custom subscriber and using in the pipe:
const doulbe = source => {
return source.lift({
call(sub, source) {
source.subscribe(new DoulbeSubscriber(sub));
}
});
};
observable$.pipe(doulbe).subscribe(subscriber);
We can use `lift` function which accpet an object has a call(subscriber, source).
[RxJS] Use `lift` to Connect a `source` to a `subscriber` in RxJS的更多相关文章
- SWD Connect/Transfer Source Code
Serial Wire Debug interface The Serial Wire Debug protocol operates with a synchronous serial interf ...
- angularjs 运行时报错ERROR in node_modules/rxjs/internal/types.d.ts(81,44): error TS1005: ';' expected. node_modules/rxjs/internal/types.d.ts(81,74): error TS1005: ';' expected. node_modules/rxjs/internal/t
解决方法: 在package.json文件里面 修改 "rxjs": "^6.0.0" 为 "rxjs": "6.0.0" ...
- [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的世界
rxjs学习了几个月了,看了大量的东西,在理解Observable的本文借鉴的是渔夫的故事,原文,知识的主线以<深入浅出rxjs>为主,动图借鉴了rxjs中文社区翻译的文章和国外的一个动图 ...
- [译]RxJS 5.X基础篇
欢迎指错与讨论 : ) 当前RxJS版本:5.0.0-beta.10.更详细的内容尽在RxJS官网http://reactivex.io/rxjs/manual/overview.html.文章比较长 ...
- angular2 学习笔记 ( rxjs 流 )
RxJS 博大精深,看了好几篇文章都没有明白. 范围牵扯到了函数响应式开发去了... 我对函数式一知半解, 响应式更是第一次听到... 唉...不过日子还是得过...混着过先呗 我目前所理解的很浅, ...
- rxjs简单入门
rxjs全名Reactive Extensions for JavaScript,Javascript的响应式扩展, 响应式的思路是把随时间不断变化的数据.状态.事件等等转成可被观察的序列(Obser ...
- RxJS v6 学习指南
为什么要使用 RxJS RxJS 是一套处理异步编程的 API,那么我将从异步讲起. 前端编程中的异步有:事件(event).AJAX.动画(animation).定时器(timer). 异步常见的问 ...
- RxJS库
介绍 RxJS是一个异步编程的库,同时它通过observable序列来实现基于事件的编程.它提供了一个核心的类型:Observable,几个辅助类型(Observer,Schedulers,Subje ...
随机推荐
- 用户交互和if条件判断、嵌套
#a=input("提示语“)#接受的数据类型是字符串str#提示用户输入姓名 # a=input("请输入姓名") print(a) '''输出结果:请输入姓名小明 姓 ...
- hdu 6441 Find Integer(费马大定理+勾股数)
题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=6441(本题来源于2018年中国大学生程序设计竞赛网络选拔赛) 题意:输入n和a,求满足等式a^n+b^ ...
- 2018美赛准备之路——Matlab基础——命令行功能函数
clc 清屏(只清除显示内容) clear 清除所有变量(运算结果) who 显示workspace的所有变量 whos 详细显示workspace的所有变量 help sin 显示sin函数 ...
- 剑指Offer(书):数组中重复的数字
题目:找出数组中重复的数字. 说明:在一个长度为n的数组里的所有数字都在0~n-1的范围内,数组中某些数字是重复的,但是不知道有几个数字重复了,也不知道每个数字重复了几次.请找出数组中任意一个重复的数 ...
- LeetCode(71) Simplify Path
题目 Given an absolute path for a file (Unix-style), simplify it. For example, path = "/home/&quo ...
- LA 4064 (计数 极角排序) Magnetic Train Tracks
这个题和UVa11529很相似. 枚举一个中心点,然后按极角排序,统计以这个点为钝角的三角形的个数,然后用C(n, 3)减去就是答案. 另外遇到直角三角形的情况很是蛋疼,可以用一个eps,不嫌麻烦的话 ...
- Centos7 中Nginx的安装与配置
安装与配置 1.安装nginx yum intsall nginxsudo systemctl start nginx 启动服务sudo firewall-cmd --permanent --zone ...
- [BZOJ4052][Cerc2013]Magical GCD
[BZOJ4052][Cerc2013]Magical GCD 试题描述 给出一个长度在 100 000 以内的正整数序列,大小不超过 10^12. 求一个连续子序列,使得在所有的连续子序列中,它们 ...
- HDU4135容斥原理
#include <cstdio> #include <string.h> #include <cmath> using namespace std; #defin ...
- Java图片缩略图裁剪水印缩放旋转压缩转格式-Thumbnailator图像处理
前言 java开发中经常遇到对图片的处理,JDK中也提供了对应的工具类,不过处理起来很麻烦,Thumbnailator是一个优秀的图片处理的开源Java类库,处理效果远比Java API的好,从API ...