Rxjs中的操作符

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/zhaoruda/article/details/82846519

过滤操作

distinct

去除重复数据，和所有的数据进行对比。
示例一

Rx.Observable.of(1,2,3,4,1)
    .distinct( )
    .subscribe( x => console.log( x ))

输出为：1,2,3,4
示例二
当然，也可以为distinct传递方法，

 Rx.Observable.of(
      { age: 4, name: 'Foo' },
      { age: 7, name: 'Bar' },
      { age: 5, name: 'Foo' })
      .distinct((p) => p.name)
      .subscribe(x => console.log(x))

输出为：
{age: 4, name: "Foo"} {age: 7, name: "Bar"}
因为distinct接受的方法用来选择使用哪个key对应的值进行去重。

distinctUntilChanged

与distinct不同的是，该操作是与最新的值进行比较。如果与最新的值相同则忽略。
示例一

Rx.Observable.of(1,2,3,4,1,1)
    .distinctUntilChanged( )
    .subscribe( x => console.log( x ))

输出为：1,2,3,4,1
示例二
distinctUntilChanged也可以接受参数

Rx.Observable.of(
      { age: 4, name: 'Bar' },
      { age: 7, name: 'Bar' },
      { age: 5, name: 'Foo' })
      .distinctUntilChanged((p,q) => p.name === q.name)
      .subscribe(x => console.log(x))

输出为：

{age: 4, name: "Bar"}
{age: 5, name: "Foo"}

该示例中传递的方法作为比较是否相等。
示例三
示例二中传递一个参数进行compare，还可以传递第二个参数选择那个key进行比较。所以示例二也可以如下所示：

Rx.Observable.of(
      { age: 4, name: 'Bar' },
      { age: 7, name: 'Bar' },
      { age: 5, name: 'Foo' })
      .distinctUntilChanged((p,q) => p === q, o=>o.name)
      .subscribe(x => console.log(x))

输出为：

{age: 4, name: "Bar"}
{age: 5, name: "Foo"}

也就是说，第二个参数选择使用那个key对应的值在第一个参数中进行比较。

take

take操作获取前几个元素后就直接结束。

 Rx.Observable.interval(1000).take(3).subscribe({
      next: (value) => console.log(value),
      complete: () => console.log('complete')
    })

输出为：

0
1
2
complete

在获取3个元素后，流就完成流，不再继续发射数据。

takeUtil

可以监听一个observable，在其发射数据的时候结束数据流。比如：

var notifier = Rx.Observable.range(0, 5).delay(5000)
Rx.Observable.interval(1000).takeUntil(notifier).subscribe({
   next: (value) => console.log(value),
   complete: () => console.log('complete')
 })

输出为：

0
1
2
3
complete

在该示例中：

1. 先创建了一个延长5s发射数据的notifier
2. 然后创建每秒发射数据的observable
3. 后创建的observable通过takeUntil来监听notifier是否发射数据
4. 在notifier未发射数据时，会输出0，1，2，3。在notifier开始发射数据后，后创建的observable结束流并发送complete。