RxJS 是针对 JavaScript 的响应式编程的库，RxJS 5 是目前最新的版本。RxJS 5 提供了许多的优秀的 API，用于管理并发数据流。使用 RxJS5 可以使代码更加简单且易于维护。
Angular 是目前最为流行的前端框架之一，它天生就支持响应式编程。
在 Angular 中使用 RxJS 5，可以使我们轻松地管理复杂的异步应用程序，从而使代码更加简单明了。
安装 RxJS
你可以通过命令行安装 RxJS，使用以下命令：
npm install rxjs了解 RxJS 5 的基本概念
使用 RxJS 5，你需要了解以下基本概念：
- Observable：Observable 是一个抽象对象，它表示一系列的值和事件，这些值和事件可以被观察者观察和消费。
- Observer：Observer 是一个对象，它在一个 Observable 上监听事件并响应这些事件。Observer 可以包含三种回调函数：Next，Error 和 Complete。
- Subscription：Subscription 是一个 Observable 的执行实例，当一个 Observer 订阅一个 Observable，就会创建一个 Subscription 对象。Subscription 对象可以用于取消订阅 Observable。
- Operator：Operator 是一些纯函数，它可以根据自己的参数转换一个 Observable，创造一个新的 Observable。
创建及订阅 Observable
Angular 在构建应用程序时，它通常需要异步获取数据，处理事件等。创建和订阅 Observable 是 RxJS 最基本的操作之一。以下示例介绍如何创建和订阅 Observable：
-- -------------------- ---- ------- ------ - ---------- - ---- ------- --- ------------ - --- ------------------- -- - -------------------- ------- ----------------- -------- -------------------- --- ------------------------------- -- -----------------------展开代码
在上述示例中，我们首先使用 Observable 构造函数创建了一个名为 myObservable 的对象。在构造函数中，我们将一个 observer 对象传递给了一个函数，这个 observer 对象有三个方法：next、error 和 complete。在该函数中，我们调用了 observer.next 方法，分别传递了两个字符串作为参数，这相当于向一个响应式数据流中添加了两个新的值。
最后，我们调用了 observer.complete，表示请求结束。
接下来，我们调用 subscribe 方法，将其传递给一个回调函数，来对 Observable 新增的值作出响应。
Operators 操作符
RxJS 在大量场景下可以通过使用 Operators 来解决问题。RxJS 5 中提供了许多 operator。
例如，我们在 Http 请求中通常使用 map 操作符将响应转换为对象或数组。
使用 Operators 时，需要先导入它，示例如下所示：
import { map } from 'rxjs/operators';
使用这个操作符：
this.http.get('/api/data') .map(res => res.json()) .subscribe(data => console.log(data));
在这个示例中，我们调用了 RxJS 中的 map 操作符，在返回的响应数据上执行了这个函数。该操作符可以将响应体 JSON 转换成 Observable 的一个可观察对象。
处理错误
当发生异常时，可以使用 catchError 操作符来执行错误处理。catchError 可以捕捉到错误，并且可以使用自己的逻辑来处理这些错误，如打印错误信息或者返回一个默认值。
接下来的示例演示了如何用 catchError 捕捉错误。
-- -------------------- ---- ------- ------ - ---------- - ---- ----------------- -------------------------- ------ ------- -- ------------ -------------- -- - ------------------- ------ ---------------------- --- --------------- -- -------------------展开代码
在这个示例中，我们演示捕捉和打印错误信息，同时重新抛出错误以便我们继续将其传递给下一个处理程序。
总结
RxJS 5 是 Angular 中推荐使用的异步处理库。它的目标是使异步代码变得简单并且更清晰易懂。
本文提供了 RxJS 5 中的一些基本概念和使用操作符的示例。这些示例可以帮助您开始构建响应式的 Angular 应用程序。希望本文对大家有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64f41c31f6b2d6eab3d40ed6
