RxJS
概述
RxJS全名Reactive Extensions for JavaScript，起源于Reactive Extensions项目，该项目主要实现各种语言的响应式编程（Reactive programming）库，被认为是观察者模式与函数式编程相结合的最佳实践。官方是这样吹嘘的：
Reactive Revolution:ReactiveX is more than an API, it's an idea and a breakthrough in programming. It has inspired several other APIs, frameworks, and even programming languages.
而RxJS是其项目中一个基于JavaScript的库，主要用于解决js中的异步编程问题。说到这里，我们又不得不提一下响应式编程的思想，其主要思路如下：
响应式的思路：是把随时间不断变化的数据、状态、事件等等转成可被观察的序列(Observable Sequence)，然后订阅序列中那些Observable对象的变化，一旦变化，就会执行事先安排好的各种转换和操作。
RxJS是比ES7中async/await更高层面的流程逻辑抽象，把异步带来的时间因素给剥离到了程序流程外部，描述了一个动态的数据结构（数据流，stream）。因为我们平时写代码时都是关注程序执行的瞬间，即静止状态，缺少了时间这个维度。所以RxJS就给我们提供了很多与时间无关的通用高层抽象，即数据流操作算符api。通过这些api，我们可以自由地定义数据流的过滤、转换和组合等操作的组合关系，而无需关心具体操作的实现。
好处
-
事件产生逻辑与处理逻辑分离
-
事件处理逻辑被数据结构化，能自由组合，方便修改扩展（函数式编程的思想）
Why RxJS
RxJS是最近几年兴起的，关注度还是挺高的（github上有18000+star）。但是其理念还是比较抽象的，所以学习成本还是有点大的。
那么为什么还是要学呢？
因为最近项目框架转型，由angularjs转向angular2+，这次Google和微软联手，angular和typescript打包，也就顺带引入了小弟RxJS（捂脸）。
不过，引入RxJS也存在着一个问题，就像知乎上说的：
Rx 的一个问题就是它其实是一个 paradigm，侵入性很强。你如果要用 Rx 写东西，最好就整个系统都是以 Rx 为核心来设计。
如何过渡到RxJS
这里主要以angularjs过渡到angular中使用RxJS为例。
普通的Promise
对于一个普通的promise，我们一般处理如下：
promise().then(
()=>{
// success
},
()=>{
// error
});
而在RxJS中，我们一般得到的是一个Observable（可观察对象），类似的像上面一样的处理被称为订阅，其实现如下：
observable().subscribe(
()=>{
// next
},
()=>{
// error
},
()=>{
// complete
});
这里的next就相当于success，但又不同。因为Observable（可观察对象）是基于推送（Push）运行时执行（lazy）的多值集合，所以对一个Observable的订阅可能产生多个next。不过对于一般的http请求，只会产生一个next。不过，两者的error基本相同。但是，这里需要注意的是，complete只会在next执行完成后调用，error时不调用。大致逻辑如下：
const observable = Observable.create(function (observer) {
try {
observer.next(1);
observer.next(2);
observer.next(3);
observer.complete();
} catch (err) {
observer.throw(new Error(err));
}
});
并发promise
在应用场景中，我们可能需要同时发送多个请求，并且成功后才进行处理。
Promise中提供了all()方法，接收参数为一个可迭代对象，使用如下：
const promise = Promise.all([promiseA, promiseB, promiseC]);
promise().then(
()=>{
// success
},
()=>{
// error
});
类似的，angularjs中提供了$q.all()。
而在RxJS中，也提供了相应的操作算符api，即Observable.forkJoin()，用法与上面类似：
const observable = Observable.forkJoin(observableA, observableB, observableC);
observable().subscribe(
()=>{
// next
},
()=>{
// error
});
需要注意的是，RxJS5以后，这种算符的使用都需要加上相应的引用，如这里需要加上import 'rxjs/add/observable/forkJoin'。
串行promise
考虑另一种场景，请求B调用依赖请求A成功后返回的数据。
在Promise中我们通常如下处理：
promiseA.then(
data=>{
// promiseA success
return promiseB(data);
},
()=>{
// error
}).then(
()=>{
// promiseB success
},
()=>{
// error
})；
类似的，RxJS中也提供了相应的api，即Observable.mergeMap()，用法如下：
observableA.mergeMap(
data=>{
// observableA next
return observableB(data);
}).subscribe(
data=>{
// observableB next
},
()=>{
// error
});
改造promise
为了方便向使用RxJS库的过渡，RxJS中还提供了toPromise()、fromPromise()方法，方便进行Observable对象与Promise对象之间的相互转换。
To be continue
当然RxJS的功能还远不止这些，持续更新中...如果有什么问题，欢迎小伙伴们一起讨论，大家一起共同进步=。=
网友评论