「这是我参与2022首次更文挑战的第21天，活动详情查看：2022首次更文挑战」
Rxjs 是 ReactiveX 的 JS 实现。按照官网介绍，ReactiveX 是使用可观察流进行异步编程的 API，它包含了各个常用编程语言与平台的多个版本实现，虽然使用的语言不同，但是其核心编程思路与基础 API 都是一致的，可以看做是一门通用技术。
在直接面向用户侧的开发中异步往往显得更加重要。因为同步的行为往往伴随着阻塞，这个阻塞的效果离用户越近，用户的感受就越明显，而异步是把响应和处理进行分离，处理的过程交给异步任务去做，给用户一个快速直观的响应，用户对卡顿的感知越小，用户体验越好。因此对于 UI 侧开发，异步更为重要，在这种情况下 RxJava、RxSwift 等在客户端开发中有着广泛的应用。
但是 Rxjs 的情况却有所不同，前端也是直接和用户 UI 打交道的，理论上 Rxjs 也应该被大规模使用，但是事实却并非如此。这里的原因很简单，因为 JS 从产生之初就是为了构建用户 UI 而存在的，因此 JS 有着天然的优先异步支持，等到 Nodejs 诞生，更是把异步编程发挥到极致。在这个背景下，JS 始终致力于从语言层面优化异步编程体验，从回调到 promise 到 generator 再到 async ... await，这些都已经成为 JS 语法中最基础的一部分，每一个前端工程师对这些都很熟悉，当遇到异步问题时，使用这些方案大部分时候能很好的解决问题，因此完全没必要再去额外学习 Rxjs。
那 Rxjs 就没有用吗？当然不是，虽然都能做，但是很多时候用好 Rxjs 能让你做的更好。这是一个宽泛的描述，需要在逐步学习之后才能理解，这里首先需要明确 Rxjs 是一套函数式和响应式的解决方案，它可以很好的处理异步问题，但是它能处理的问题不限于异步场景。按照官网的描述，你可以把 RxJS 当做是用来处理事件的 Lodash。
本篇文系列文章第一篇，先来整体看一下 Rxjs 的一些概念：
- Observable：可观察的对象，可以理解为这是一个事件的发生源，Observable 中未来可能会产生一系列的数据流，这些东西可以被观察者观察到。
- Observer：观察者，就是观察 Observable 的对象，当 Observable 中产生数据时会通知所有的观察者，观察者收到数据流之后可以进行处理。
- Subscription：订阅，一个 Observer 对一个 Observable 进行观察，这个过程叫做订阅，这是就会产生一个订阅对象 Subscription。
- Operators：操作符，是一系列接收数据流输出数据流的函数，可以理解为数据流从 Observable 上产生到 Observer 接收到之间经过的一系列管道，在其中可以对原始数据流进行加工处理。
- Subject：这是一种既可以做 Observable 也可以做 Observer 的对象，他可以产生数据流，也可以订阅数据流，通常可以用来实现事件发生器的效果，可以作为组合数据流的桥梁。
- Schedulers：调度器，用来处理资源的调度与分配。
这些概念比较抽象，先看一个基础的例子理解 Observable 和 Observer：
var observable = Rx.Observable.create(function (observer) {
observer.next(1);
observer.next(2);
observer.next(3);
setTimeout(() => {
observer.next(4);
observer.complete();
}, 1000);
});
console.log('just before subscribe');
observable.subscribe({
next: x => console.log('got value ' + x),
error: err => console.error('something wrong occurred: ' + err),
complete: () => console.log('done'),
});
console.log('just after subscribe');
这里通过 Observable.create 创建的就是一个 Observable 对象，在这个 Observable 中会先发出 1、2、3 三个数字，1s 之后再发出一个 4，这些东西只有观察者才能收到，我们使用 subscribe 添加一个观察者 Observer，Observer 的 next 回调函数中就可以观察到 Observable 发出的数据，最终输出结果：
just before subscribe
got value 1
got value 2
got value 3
just after subscribe
got value 4
done
这是一个最基础的 Rxjs 示例，而 Rxjs 中最强大的地方就是它有很多功能强大的操作符，操作符有着不同的用途，它们可作如下分类：创建、转换、过滤、组合、错误处理、工具，等等。正确使用这些操作符能够极大程度提升开发效率，这些操作符有很多，最大的问题往往是不知道用哪个，因此接下来会系统的来看一下这些操作符的用法。
