博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
【rxjs5.x】Transformation操作符
阅读量:6083 次
发布时间:2019-06-20

本文共 4041 字,大约阅读时间需要 13 分钟。

map

对 Observable 对象发出的每个值,使用指定的 project 函数,进行映射处理。

var source = Rx.Observable.interval(1000);var newest = source.map(x => x + 2); newest.subscribe(console.log);

示例 marble 图:

source: -----0-----1-----2-----3--...            map(x => x + 2)newest: -----2-----3-----4-----5--...

以上代码运行后,控制台的输出结果:

234...

mapTo

对 Observable 对象发出的每个值,映射成固定的值。

var source = Rx.Observable.interval(1000);var newest = source.mapTo(2); newest.subscribe(console.log);

示例 marble 图:

source: -----0-----1-----2-----3--...                mapTo(2)newest: -----2-----2-----2-----2--...

以上代码运行后,控制台的输出结果:

222...

scan

对 Observable 发出值,执行 accumulator 指定的运算,可以简单地认为是 Observable 版本的 Array.prototype.reduce 。

var source = Rx.Observable.from('hello')             .zip(Rx.Observable.interval(600), (x, y) => x);var example = source.scan((origin, next) => origin + next, '');example.subscribe({    next: (value) => { console.log(value); },    error: (err) => { console.log('Error: ' + err); },    complete: () => { console.log('complete'); }});

示例 marble 图:

source : ----h----e----l----l----o|    scan((origin, next) => origin + next, '')example: ----h----(he)----(hel)----(hell)----(hello)|

以上代码运行后,控制台的输出结果:

hhehelhellhellocomplete

(备注:scan 与 reduce 最大的差别就是 scan 最终返回的一定是一个 Observable 对象,而 reduce 的返回类型不是固定的)

buffer

缓冲源 Observable 对象已发出的值,直到 closingNotifier 触发后,才统一输出缓存的元素

var source = Rx.Observable.interval(300);var source2 = Rx.Observable.interval(1000);var example = source.buffer(source2);example.subscribe({    next: (value) => { console.log(value); },    error: (err) => { console.log('Error: ' + err); },    complete: () => { console.log('complete'); }});

示例 marble 图:

source : --0--1--2--3--4--5--6--7..source2: ---------0---------1--------...            buffer(source2)example: ---------([0,1,2])---------([3,4,5])

以上代码运行后,控制台的输出结果:

[0,1,2][3,4,5][6,7,8]....

bufferTime

设定源 Observable 对象已发出的值的缓冲时间。

var source = Rx.Observable.interval(300);var example = source.bufferTime(1000);example.subscribe({    next: (value) => { console.log(value); },    error: (err) => { console.log('Error: ' + err); },    complete: () => { console.log('complete'); }});

示例 marble 图:

source : --0--1--2--3--4--5--6--7..            bufferTime(1000)example: ---------([0,1,2])---------([3,4,5])

以上代码运行后,控制台的输出结果:

[0,1,2][3,4,5][6,7,8]....

bufferCount

缓冲源 Observable对象已发出的值,直到大小达到给定的最大 bufferSize 。

ar source = Rx.Observable.interval(300);var example = source.bufferCount(3);example.subscribe({    next: (value) => { console.log(value); },    error: (err) => { console.log('Error: ' + err); },    complete: () => { console.log('complete'); }});

示例 marble 图:

source : --0--1--2--3--4--5--6--7..            bufferCount(3)example: ---------([0,1,2])---------([3,4,5])

以上代码运行后,控制台的输出结果:

[0,1,2][3,4,5][6,7,8]....

concatMap

对每个 Observable 对象发出的值,进行映射处理,并进行合并。该操作符也会先处理前一个 Observable 对象,在处理下一个 Observable 对象。

var source = Rx.Observable.fromEvent(document.body, 'click');var example = source.concatMap(                e => Rx.Observable.interval(100).take(3));                example.subscribe({    next: (value) => { console.log(value); },    error: (err) => { console.log('Error: ' + err); },    complete: () => { console.log('complete'); }});

示例 marble 图:

source : -----------c--c------------------...        concatMap(c => Rx.Observable.interval(100).take(3))example: -------------0-1-2-0-1-2---------...

以上代码运行后,控制台的输出结果:

012012

concatMap 其实就是 map 加上 concatAll 的简化写法。

switchMap

对源 Observable 对象发出的值,做映射处理。若有新的 Observable 对象出现,会在新的 Observable 对象发出新值后,退订前一个未处理完的 Observable 对象。

var source = Rx.Observable.fromEvent(document.body, 'click');var example = source.switchMap(                    e => Rx.Observable.interval(100).take(3));                example.subscribe({    next: (value) => { console.log(value); },    error: (err) => { console.log('Error: ' + err); },    complete: () => { console.log('complete'); }});

示例 marble 图:

source : -----------c--c-----------------...        concatMap(c => Rx.Observable.interval(100).take(3))example: -------------0--0-1-2-----------...

以上代码运行后,控制台的输出结果:

0012

转载地址:http://nqkwa.baihongyu.com/

你可能感兴趣的文章
5-19 求链式线性表的倒数第K项 (20分)
查看>>
linux NFS 配置
查看>>
站立会议7
查看>>
linux客户端传输文件到Windows本地
查看>>
此生未完成
查看>>
c# 反射
查看>>
KVO的使用
查看>>
超图SuperMap Is.Net开发心得及一些问题
查看>>
问题2017S03
查看>>
【转载】工作中遇到的js问题以及问题的解决方案
查看>>
序列化
查看>>
点是否在多边形内部的检验
查看>>
SQL Serever学习11——数据库的安全管理
查看>>
搭桥(最小生成树)
查看>>
ES6学习笔记之数组
查看>>
OneZero第四周第一次站立会议(2016.4.11)
查看>>
习题6-6 使用函数输出一个整数的逆序数
查看>>
HRBUST 1376 能量项链【DP】
查看>>
【分享】Google Java编程风格指南 ()中文版)
查看>>
KVM虚拟化简介及安装
查看>>