Observable入门

1.  什么是Observable和 Observer?

1.1 Observable

Observable是能向观察它的人(或外界)在一定时间段内推送值的实体。

Observable实体可能会一直推送下去,也可能在某时间点结束,也可能在某时间点抛出error

故Observable可能的行为为:

向observer推送值,告诉observer结束,告诉observer有异常(error)

 

例子:

Observale 实体:

第1步向观察它的实体(observer)推送值1

第2步向观察它的实体(observer)推送值2

第3步向观察它的实体(observer)推送值3

然后 等待10分钟

第4步向observer推送值4

第5步告诉observer结束了

 

实现为编程语言为:

observer.next(1);

observer.next(2);

observer.next(3);

setTimeout(()=>{

           observer.next(4);

           observer.complete();

}, 1000*60*10);

 

1.2 Observer

是观察Observable的行为后,对其行为进行响应的实体。

做出的响应有三类:

对于推送值的响应

对于结束的响应

对于observable抛出的error的响应

 

2.  http请求的Observable的例子

谁是observable?

HTTP的response是一个observable:它对观察它的实体在timeout时间内

推送值或抛出异常

 

谁是observer?

就是得到response后,做处理。

对推送值做处理 或者是 对error做处理

 

3.  如何生成Observable

3.1 自己把observable的动作序列编程实现,比如第一个例子

3.2 已有的返回observable的服务

比如http的get

 

3.3 rxjs库里,提供构造简单的observable实体的方法。

一个简单的observable是一个接一个的推送值,供推送n次

Rxjs提供的方法有:

Observable.of(x1,x2,…,xn);

或者

Observable.from([x1,x2,…,xn]);

 

4.  Observable的算符

【Old Observable】-- operator –> 【New Observable】

 

Map filter reduce pipe

4.1 map最简单

Observablex.map(x => 2*x) 则之前推送为10时,经过算符,推送20

4.2 filter也不难

Observablex.filter(x => x%2 === 0) 则推送是偶数时,接着推送;推送是奇数时,则不推送

 

4.3 todo


5.  理解Angular中对参数的操作

ngOnInit(){

this.hero$ =this.route.paramMap.pipe( switchMap((params:ParamMap)=>this.service.getHero(params.get('id'))));

}

注意:ParamMap类型不是Observable; this.route.paramMap返回的是Observable

根本目的是 想做一个map,使得输入的每一个 params得到对应的 Hero。

即 params:ParamMap => Hero

但是,因为this.service.getHero 返回的是 Observable

所以 需要把返回的flat化。

所以 当 函数的输入输出类型是  ClassA => ClassB 时,使用map

当 函数的输入输出类型是 ClassA=> Observable时,使用 switchMap


你可能感兴趣的:(Observable入门)