什么是Rx
Rx是Reactive Extentions(响应式拓展)的缩写,可以看出这是一种拓展,下面是官方描述:
An API for asynchrnous programing with observable stream
翻译:利用observable流来异步编程的API。
其实Rx就是一种对语言的响应式支持,它有各种语言实现,RxJS是利用JavaSctipt语言实现的对JS的响应式拓展。RxJava是对Java的拓展。
Observable和Observer
Observable和Observer是RxJs内非常重要的两个概念,尤其是Observable,RxJs内有很多很多的操作符,这些操作符全都是围绕Observable来展开工作的,每一个操作符功能都很简单,但是各种操作符搭配就可以完成非常复杂的需求。
Observable
Observable可观察对象是一个数据流,承载了很多的数据,这里的数据不仅仅是像1,2,3,"A","B"这种值也包含像JS的DOM事件,promise对象等,Observable这个数据流就有序的发送这些”数据“,如同工厂的”传送带“一样,发送给下一个工作点,这里工作点就对应了操作符,经过操作符产生新的Observable对象(源对象不会改变,这里符合了函数式编程的数据不可变性),经过多个操作符形成最终需要的数据流,通知观察者Observer推送数据或者异常。
Observable最终的状态只能改变一次,那就是error或者completed,当Observable改变状态时会触发观察者Observer相应的方法。
Observer
Observer是观察者,是一个对象,格式如下:
{
next:data=>{},
error:err=>{},
complete:()=>{}
}
next:可以出发多次,由Observable内通过next方法通知。
error:只可以触发一次,由Observable内通过error方法通知。
complete:只可以触发一次,由Observable内通过complete方法通知。
一个简单的示例如下:
const observable = new Observable((observer)=>{
observer.next(1);
observer.next(2);
observer.next(3);
observer.next(4);
observer.next(5);
observer.complete();
});
const observer = {
next:data=>{
console.log(data)
},
error:err=>{
console.log(err)
},
complete:()=>{
console.log("observable is completed!")
}
};
observable.subscribe(observer);
需要注意的是,Observable更多的是利用操作符来生成而不是通过new来创建,操作符按照功能划分为以下几类:
1.创建类,用于创建Observable
2.合并类,用于合并多个Observable
3.辅助类,用于各种场景辅助完成某项功能,如max,min,count这种操作符
4.过滤类,用于过滤出需要的数据形成新的Observable
5.转换类,用于将原来Observable的数据进行转换操作
注意!所有的操作符都不会改变原来的Observable,而是生成新的Observable。
各个操作符之间是链式使用,上一个操作符产生的Observable交给下一个操作符进行处理,因此如何熟练的运用操作符是掌握RxJS的重点。