rxjs 入门学习-常用的API(1)

1. 常见的创建类操作符

  from: 可以把数组,Promise,以及Iterable 转化为 Obsevable

  fromEvent: 可以把事件转化为 Observable

  of: 接受一系列的数据,并把他们emit出去

2 .  网站 RxMarbles.com 有大部分操作符的宝珠图

3. mapTo  相当于map ( _  => 1);

4. 假设有个observable事件,

         var length = document.getElementById('length');

        const length$ = observable.formEvent(length , 'keyup') pluck('target' , 'value')  相当于

        const length$ =  observable.formEvent(length, 'keyup').map ( ev=> ev.target.value)

5.  observal的参数next,error ,complete  , interval(), take()

           const interval$ = Rx.observable.interval(100) : 表示间隔100ms 发送一次

           const interval$ = Rx.observable.interval(100).take(3): take表示取前几个

          例子:


6. timer( 100, 100);

        第一个参数代表延迟100ms 运行

        第二个参数代表 运行后 以100ms 事件周期发送数据,

7. do()

          相当于连接外界的桥梁,可以改变外部值等,但不影响subsrcibe()。


8. skip(2)

        表示省略掉2个元素,从第三个开始

9. skan( (x, y)=> {return x+y})

        skan 里面是个函数,函数传参的第一个值x 表示是一个累加器的值,即 renturn的x+y的值 会传给x, 而y 就是传进去流的值。


10. reduce( (x, y)=> { return [...x, y] } , [ ]);

        reduce和scan比较像,但是scan 是一个个值发射出去,而reduce 只发射最终的运算结果,

        其中 x 为累加的结果,y是流传过去的结果, reduce的处理不仅仅局限于数值,也可以是一个对象,数组,字典对象等,如上, 给x赋初始值 [ ],


11. nerver();

        不会emit, 也不会结束

12. empty()

        直接结束,但不发射

13. throw()

        进入error 状态

14. debounce()  和  debounceTime()

        debounceTime(300)  表示 300ms 发射一次值,期间的值全部过滤掉

        debounce( () => Rx.observable.interval(300)) 效果和上述相似,但比上述强大,可以自定义条       件。

15. distinct()

        让整个序列中没有元素, 由于distinct 是对整个序列监控,因此,对于无尽序列要小心使用。

16. distinctUntilChanged()

        和它前一个对比,不能相同。

17. merge( observableA$, observableB$ )

      把observableA$ 和 observableB$ 按照他们自身的顺序,合并起来

18. concat( observableA$, observableB$)

        与数组类似,将observableB$ 连接到 observableA$ 的后面, 如果 observableA$  是个无尽序列,那么将只会输出 observableA$。

19 . startWith()

        比如 startWith(0) 就是在序列前面concat一个 0, 作用是给,序列赋一个初始值

20. combineLatest()

        例如const merge$ =  Rx.observable. combineLatest(  observableA$, observableB$, (x, y) => x+y)  两个流都有值的时候流才开始,任何一个值的改变,也会重新触发

21. zip()

                const merge$ =  Rx.observable. zip(  observableA$, observableB$, (x, y) => x+y)

        zip  和 combineLatest不同的是, zip 是两个流序列 一一对应计算的,比如 observableA$序列的第一个数 和observableB$ 第一个数相对应的。

22 . withLatestFrom()

          此方法输出的是一个数组,不要求成对出现, 但只有第一个流发生改变时,才会触发。第二个流改变,没有任何影响。

高级操作符

23. mergeMap()

    此方法是把多个流合并成一个流(拍扁),按照顺序穿插,会保留所有元素的子元素

24. swtichMap()

     switchMap相比于mergeMap ,当新流来的时候,会抛弃原来的流。

举个例子, 比如删除文章操作,删除文章的时候也会删除文章下面的评论,对于mergeMap,当删除第一篇文章的时候,删除第二篇文章的需求来了,那么还会继续删除第一篇文章的评论同时穿插第二篇文章的删除需求。对于switchMap,当第二篇文章删除需求来了,那么就会停止第一篇文章评论删除需求,进而处理第二篇文章删除需求。

你可能感兴趣的:(rxjs 入门学习-常用的API(1))