博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
RxJS操作符(一)
阅读量:5930 次
发布时间:2019-06-19

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

一、创建类操作符

创建类操作符是连接传统编程和响应式编程的强梁

from: 可以把数组、Promise、以及Iterable转化为Observable。

fromEvent: 可以把事件转化为Observable

of :接受一系列的数据,并把它们emit出去(不一定是数组)

1、fromEvent

把length的keyup事件转化为Observable对象。

const length$ =Rx.Observable.fromEvent(length,'keyup').pluck('target','value');

2、from

输入数组,出来一个一个元素。

发射出来很快,直接取到最后一个值。

const length$=Rx.Observable.from([1,2,3,4]);

3、of

把对象转化为Observable

const length$=Rx.Observable.of({id:1,value:20});

计算时候拿l.value计算

const area$=Rx.Observable.combineLatest(length$,width$,(l,w)=>{
return l.value*w});

可以把任意多个,可以是不一样的对象转化

const length$=Rx.Observable.of({id:1,value:20},{key:'xx',value:'blalala'});

二、转换类操作符

  • map
  • mapTo
  • pluck

mapTo和pluck都是map的一种变形。

Marbles图:

const length$ =Rx.Observable.fromEvent(length,'keyup').pluck('target','value');const width$ =Rx.Observable.fromEvent(width,'keyup').pluck('target','value');

等价于

const length$ =Rx.Observable.fromEvent(length,'keyup').map(event=>event.target.value);const width$ =Rx.Observable.fromEvent(width,'keyup').map(event=>event.target.value);

pluck是map的简化用法。

mapTo

mapTo成一个固定值,常量,

使用场景:用于不关心值,button的click事件,只需要知道发生了点击事件。点击一次一个1,最后处理可能是累加起来。

const length$ =Rx.Observable.fromEvent(length,'keyup').mapTo(1);const width$ =Rx.Observable.fromEvent(width,'keyup').mapTo(2);

相当于是:两个序列的常数流

const length$ =Rx.Observable.fromEvent(length,'keyup').map(_=>1);const width$ =Rx.Observable.fromEvent(width,'keyup').map(_=>2);

只关心事件发生了,不关心值。

map:原始流和转换后的流发生的时间点一样。 

 

本文作者,因知识本身在变化,作者也在不断学习成长,文章内容也不定时更新,为避免误导读者,方便追根溯源,请诸位转载注明出处: 有问题欢迎与我讨论,共同进步。 

你可能感兴趣的文章
一站式解决,Android 拍照 图库的各种问题
查看>>
lsof命令
查看>>
阿里云云计算ACP考试知识点(标红为重点)
查看>>
从零开始来看一下Java泛型的设计
查看>>
Shell编程基础
查看>>
Shell之Sed常用用法
查看>>
3.1
查看>>
校验表单如何摆脱 if else ?
查看>>
跨运营商组播传送案例(multicast-proxy-register应用)
查看>>
JTable的DefaultModel方法getValueAt(a,row)
查看>>
Good Bye 2013 A
查看>>
Automatic Sql Server Backup Utility Using sqlserveragent
查看>>
Java是如何读取和写入浏览器Cookies的
查看>>
篇一、安装配置Android Studio
查看>>
C#代码安装、卸载、监控Windows服务
查看>>
2014年抢票总结
查看>>
zephir开发的扩展“wudimei框架”之模板词法扫描(三)完成代码切分
查看>>
ML 线性回归Linear Regression
查看>>
【转载】SweetAlert2 使用
查看>>
oracle如何用sql查看触发器?
查看>>