工作生活

深入浅出Rxjs笔记 二

2019-07-03  本文已影响0人  月半女那

三.操作符基础

在RxJs中‘操作符’其实是operator,他并不是一个字符,而是函数。

  1. 静态操作符和实例操作符
  1. 操作符分类
  1. 如何实现操作符
const result = source$::map(x => x*2)::map(x => x-1)
  1. pipeable/letable
    pipeable: 值 |> 函数
    pipeable操作符使用方法:
666 |> foo |> bar
=> bar(foo(666))

四.创建数据流

在RxJs中一切都以数据流为中心,在代码中,数据流以Observable类的实例对象形式存在,创建Observable对象就是创建数据流处理的开始

  1. 创建类操作符往往不会从其他Observable对象获取数据,在数据管道中,创建类操作符就是数据流的源头。所以创建类操作符大部分是静态操作符。
功能需求 使用的操作符
直接操作观察者 create
根据有限的数据产生同步数据 of
产生一个数值范围内的数据 range
以循环方式产生数据 generate
重复产生数据流中的数据 repeat/repeatWhen
产生空数据流 empty
产生直接出错是数据 throw
产生用不完结的数据 never
间隔给定时间持续产生数据 interval/timer
从数组等枚举类型数据产生数据流 from
从promise对象产生数据流 fromPromise
从外部事件对象产生数据流 fromEvent / fromEventPattern
从AJAX产生数据流 ajax
延迟产生数据流 defer
Observable.create = function(subscribe){
    return  new Observable(subscribe)
}

创建同步数据的Observable对象

import { of } from 'rxjs';
of(10, 20, 30)
.subscribe(
 console.log,
 null,
 ()=> {
     console.log('complete')
 }
);
// 10
// 20
// 30
complete

在数据被subscribe时,吐出数据的过程时同步的,没有任何时间间隔,在数据产生完毕之后,对应的Observable对象也就完结了。
of 产生的是Cold Observable对于每一个Observer都会重复吐出同样的一组数据所以可以反复使用

range(start: number = 0, count?: number, scheduler?: SchedulerLike): 
Observable<number>
import {range} from 'rxjs'

range(1,40).subscribe(
     console.log,
     null,
     ()=> {
         console.log('complete')
     })
// 1
// 2
// 3
// .
// .
// .
// 39
// 40
// complete
generate<T, S>(
initialStateOrOptions: S | GenerateOptions<T, S>,  
condition?: ConditionFunc<S>, 
iterate?: IterateFunc<S>, 
resultSelectorOrObservable?: (ResultFunc<S, T>) | SchedulerLike, 
scheduler?: SchedulerLike): Observable<T>

// initialStateOrOptions:初始值
// condition:条件
// iterate: 每次递增值的变化,是个函数
// resultSelectorOrObservable: 产生结果
import {generate} from 'rxjs'
generate(1,x=> x <10, x=> x+2, x=> x+'haha').subscribe(
         console.log,
     null,
     ()=> {
         console.log('complete')
     })

// 1haha
// 3haha
// 5haha
// 7haha
// 9haha
// complete

上一篇下一篇

猜你喜欢

热点阅读