RxJS常用操作符

以下只是列出的一些常用操作符的常用方法,具体请参考RxJS中文网

创建操作符

interval():Observable

每个时间间隔都发出自增整数的Observable,自增整数是从0开始的。第一次并没有立马去发送, 而是第一个时间段过后才发出。

range(start:number,count:number):Observable

start和count分别为区间的开始和长度
创建一个observable,顺序发出一个有限区间范围内的连续整数,同步发送

defer(function):Observable

创建一个Observable,function可看做observableFactory,当且仅当输出Observable被订阅时,使用ObservableFactory惰性创建一个新的observable。
注意:每个订阅者获得的都是只属于它们自己的Observable。

timer(initialDelay,?period):Observable

创建一个Observable,该Observable在初始initialDelay后发出0,并且在之后的每个period后发出自增的数字。如果时间周期没有被指定,输出Observable只发出0。否则,会发送一个无限数列。

throw(any):Observable

创建一个Observable,它不发送数据给观察值,仅仅只是立即发出error通知。常和其他Observable组合使用,如在mergeMap中使用。

转换操作符

map(function):Observable

将function应用于源 Observable 发出的每个值,结果值作为 输出Observable要发出的值。

mapTo(value:any):Observable

每次源Observble发出值时,都在输出Observable上发出给定的常量值。类似于 map,但它每一次都把源值映射成同一个输出值。

mergeMap(function):Observable

function 源Observable发出一个值时,该函数就接收该值作为参数,并返回一个Observable对象。然后使用merge并行合并所有的输入Observable。
相当于先使用map,再使用merge。

switchMap(function):Observable

function 源Observable发出一个值时,该函数就接收该值作为参数,并返回一个(所谓的“内部”)Observable 。然后使用switch打平。
相当于先使用map,再使用switch。如:

var clicks = Rx.Observable.fromEvent(document, 'click');
var result = clicks.switchMap((ev) => Rx.Observable.interval(1000));
result.subscribe(x => console.log(x));

buffer(closingNotifier):Observable

buffer(closingNotifier):Observable<T[]>
closingNotifer:一个Observable对象
将源Observable发出的值缓冲起来,直到closingNotifier发出值,输出Observable才发出该缓冲区的值并且内部开启一个新的缓冲区,等待下一个closingNotifier的发送。将过往的值收集到一个数组中。

pluck(properties:…string):Observable

properties:描述对象属性路径的字符串的列表
类似于 map,但仅用于选择源Observable每个发出对象的某个嵌套属性值。如果属性无法解析,它会返回 undefined 。如:

//将每次点击映射成点击的 target 元素的 tagName 属性
var clicks = Rx.Observable.fromEvent(document, 'click');
var tagNames = clicks.pluck('target', 'tagName');
tagNames.subscribe(x => console.log(x));

pairwise():Observable

pairwise():Observable<Array<T>>
将源Observable发出的当前值和发出的前一个值,作为数组放在一起,然后输出Observable发出该数组。
源Observable的第N个发送会使输出Observable发出一个数组[(N-1)th, Nth]。所以当源Observable发出第一个值时,输出Observable不发出任何值。

scan(function,?seed):Observable

function可看做累加器。如果seed值提供了,这个值会被累加器用作初始值。 如果seed值没有被提供, 源数据的第一项会被当做初始值。
输出Observable第一次发出的值即初始值,之后每累加一次,输出Observable就会发出该中间值

过滤操作符

debounce(function):Observable

function返回durationObservable,只有当durationObservable发出值或者完成时,输出Observable才会发出源Observable的最新值,而其余的会被丢弃。
注意:这个操作符会追踪源Observable的最新值。有点像延时发送。

throttle(function):Observable

function接收源Observable发出的值,返回一个durationObservable,用于为每个值计算沉默的时间

最开始,源Observable发出第一个值时,输出Observable会转发该值,然后当durationObservable发出值或者完成时,输出Observable才能继续转发源Observable发出的值;一旦转发过后,又要等待durationObservable发出值或完成,即之后重复此过程,如:

var clicks = Rx.Observable.fromEvent(document, 'click');
var result = clicks.throttle(ev => Rx.Observable.interval(1000));
result.subscribe(x => console.log(x));

源Observable发出一个值一秒后,输出Observable可以开始发出源Observable发出的值;源Observable再发出一个值后,即继续重复此过程

take(count:number):Observable

输出Observable只转发源Observable发出的前count个值。

takeUntil(notify):Observable

输出Observable 发出源Observable所发出的值,直到某个时间点notifier发出它的第一个值或者完成。

takeWhile(predicate):Observable

源 Observable发出的每个值都会传给predicate函数,它会返回源值是否满足条件的布尔值。若为真,则输出Observable转发源Observable发出的该值。若为假,则输出Observable立即完成。

skip(count:Number):Observable

返回一个Observable,该Observable跳过源Observable发出的前N个值(N = count)。

last(function?):Observable

若无function参数,则输出Observable只在源Observable完成时,发出源Observable发出的最后一个值。
若有function参数,则输出Observable发出源Observable的发出值中满足该函数的最后一项。

如果Observale完成前还没有发出任何next通知的话,就会发送EmptyError给观察者的error回调函数。如果在源Observable中没有匹配predicate函数的项,则抛出。

first()

参考last()操作符。
假如在源Observable完成前无法发出一个有效值的话,那么会发出defaultValue。如果没有提供defaultValue并且也找不到匹配的元素,则抛出错误。

filter(function):Observable

function:接收源Observable发出的值,返回布尔值
此操作符只发送源 Observable的中满足指定function函数的项来进行过滤。

组合操作符

merge(Observables):Observable

输出Observable发出的值是每个输入Observable发出的值。所有的输入 Observable都完成了,输出Observable才能完成。任何由输入Observable发出的错误都会立即在输出Observalbe上发出。并行合并

concat(InputObservables):Observable

顺序的、串行的将所有输入Observable发出的值合并给输出Observable。 只有前一个Observable结束才会进行下一个Observable。

switch():Observable

将高阶Observable(发出Observable的Observable)转换成一阶Observable。
每次观察到这些已发出的内部Observables中的其中一个时,输出Observable订阅这个内部Observable并开始发出该Observable所发出的项。当发出一个新的内部 Observable 时,switch会从先前发送的内部Observable 那取消订阅,然后订阅新的内部Observable并开始发出它的值。后续的内部Observables也是如此。如:

var clicks = Rx.Observable.fromEvent(document, 'click');
// 每次点击事件都会映射成间隔1秒的 interval Observable
var higherOrder =clicks.map((ev)=>Rx.Observable.interval(1000));
var switched = higherOrder.switch();
// 结果是 `switched` 本质上是一个每次点击时会重新启动的计时器。
//注意是重新启动
switched.subscribe(x => console.log(x));

startWith(values:…T):Observable

返回的 Observable会先发出作为参数指定的项,然后再发出由源Observable 所发出的项。如:

//先发出数字7,然后发出错误通知。
var result = Rx.Observable.throw(new Error('oops!')).startWith(7);
result.subscribe(x => console.log(x), e => console.error(e));

工具操作符

do(function):Obsrvable

方便我们进行debug和跟踪数据变化。你可以用它做任何操作,一般都是有副作用的操作,比如控制台打印,写入文件,修改DOM节点等等,但它不改变事件流中的事件
如果 do 返回的 Observable没有被订阅,那么function指定的副作用永远不会执行。因此do只是侦查已存在的执行,它不会像subscribe那样触发执行的发生。

delay(delay:number|Date):Observable

如果延时参数是数字,这个操作符会将源Observable的发出时间都往后推移固定的毫秒数。 保存值之间的相对时间间隔。
如果延迟参数是日期类型,这个操作符会延时Observable的执行直到到了给定的时间。

observeOn(scheduler,delay:number):Observable

scheduler:使用该调度器来重新发出源Observable的所有通知。
delay:以毫秒为单位指定延迟通知的发送时间。

observeOn与delay操作符最主要的区别是它会延迟所有通知,包括错误通知,而delay会当源Observable发出错误时立即通过错误。通常来说,对于想延迟流中的任何值,强烈推荐使用delay操作符,而使用observeOn时,用来指定应该使用哪个调度器来进行通知发送。

数学和聚合操作符

reduce(function,?seed):Observable

function可看做累加器。如果seed值提供了,这个值会被累加器用作初始值。 如果seed值没有被提供, 源数据的第一项会被当做初始值。
输出Observable只会发出一个值,并且是当源Observable完成时才发出.它等价于使用 scan 操作符后面再跟 last 操作符。

max(function):Observable

源Observable完成时,输出Observable发出单一项
function可选,用于比较

min(function):Observable

源Observable完成时,输出Observable发出单一项
function可选,用于比较

多播操作符

multicast(subject):ConnectableObservable

工作原理:观察者订阅一个基础的 Subject,然后 Subject 订阅源 Observable 。
ConnectableObservable被订阅时,就像subject。有一个connect()方法,该方法决定何时启动共享Observable的执行,返回的是subscription对象,可以依据此取消共享Observable的执行。如:

var source = Rx.Observable.from([1, 2, 3]);
var subject = new Rx.Subject();
var multicasted = source.multicast(subject);

// 在底层使用了 `subject.subscribe({...})`:
multicasted.subscribe({
  next: (v) => console.log('observerA: ' + v)
});
multicasted.subscribe({
  next: (v) => console.log('observerB: ' + v)
});

// 在底层使用了 `source.subscribe(subject)`:
multicasted.connect();

refCount():Observable

源Observable类型为ConnectableObservable,输出Observable类型为普通的Observable。
refCount的作用是,当有第一个订阅者时,多播Observable会自动地启动执行,而当最后一个订阅者离开时,多播Observable会自动地停止执行。

var source = Rx.Observable.interval(500);
var subject = new Rx.Subject();
var refCounted = source.multicast(subject).refCount();
var subscription1, subscription2, subscriptionConnect;

// 这里其实调用了 `connect()`,
// 因为 `refCounted` 有了第一个订阅者
console.log('observerA subscribed');
subscription1 = refCounted.subscribe({
  next: (v) => console.log('observerA: ' + v)
});

setTimeout(() => {
  console.log('observerB subscribed');
  subscription2 = refCounted.subscribe({
    next: (v) => console.log('observerB: ' + v)
  });
}, 600);

setTimeout(() => {
  console.log('observerA unsubscribed');
  subscription1.unsubscribe();
}, 1200);

// 这里共享的 Observable 执行会停止,
// 因为此后 `refCounted` 将不再有订阅者
setTimeout(() => {
  console.log('observerB unsubscribed');
  subscription2.unsubscribe();
}, 2000);

执行结果:
observerA subscribed
observerA: 0
observerB subscribed
observerA: 1
observerB: 1
observerA unsubscribed
observerB: 2
observerB unsubscribed

没有更多推荐了,返回首页

私密
私密原因:
请选择设置私密原因
  • 广告
  • 抄袭
  • 版权
  • 政治
  • 色情
  • 无意义
  • 其他
其他原因:
120
出错啦
系统繁忙,请稍后再试