第一章：RxJS 简介
1.1 什么是 RxJS？
对于资深前端工程师来说，我们可以这样定义 RxJS：
RxJS 是一个基于可观察序列（Observable sequences）的、用于处理异步和事件驱动编程的函数式反应式编程（FRP）库。
它将“观察者模式”、“迭代器模式”和“函数式编程”的思想与“集合操作”相结合，为处理和组合异步事件流提供了一套极其强大和富有表现力的工具。
如果说 Promise 是对单个未来值的抽象，那么 Observable 就是对多个未来值的抽象。它可以模拟和统一处理各种异步来源，如：
- DOM 事件：点击、鼠标移动、键盘输入
- HTTP 请求：单个请求、轮询、SSE
- WebSockets：实时双向通信
- 动画：
requestAnimationFrame - 定时器：
setTimeout,setInterval - 复杂的用户交互：拖放、多点触控
1.2 为什么选择 RxJS？(与 Promise/async-await 的深度对比)
我们已经熟练掌握了 Promise 和 async/await，它们在处理“一次性”异步操作时非常出色。但当面临更复杂的场景时，RxJS 的优势就显现出来了。
| 特性 | Promise / async-await | RxJS (Observable) |
|---|---|---|
| 数据流 | 单个值 | 多个值（流） |
| 可取消性 | 不可取消 (No built-in cancellation) | 可取消 (Cancellable) |
| 懒执行 | 立即执行 (Eager) | 懒执行 (Lazy) |
| 操作符 | 有限 (.then, .catch, .finally) | 极其丰富 (map, filter, reduce, mergeMap, etc.) |
| 适用场景 | 获取数据、一次性异步操作 | 复杂事件处理、实时数据、UI 交互、状态管理 |
核心优势：
- 强大的组合能力：RxJS 提供了超过 100 个操作符，让你可以像操作数组一样（
map,filter,reduce）来组合、转换和控制事件流。这是 Promise 无法比拟的。 - 统一的异步模型：将所有异步源（DOM 事件、HTTP 请求等）都抽象为 Observable，让你可以用同样的方式处理它们，极大地降低了心智负担。
- 精细的流控制：通过
debounceTime,throttleTime,switchMap,takeUntil等操作符，可以轻松实现防抖、节流、请求切换、生命周期管理等高级功能，而这些用 Promise 实现起来会非常复杂。 - 天然的可取消性：当一个 Observable 被取消订阅（unsubscribe）时，所有相关的计算和资源（如进行中的 HTTP 请求）都会被清理。这对于避免内存泄漏和不必要的计算至关重要。
1.3 何时不应该使用 RxJS？
RxJS 是一个强大的工具，但不是银弹。在以下情况下，使用 RxJS 可能会“杀鸡用牛刀”：
- 简单的、一次性的异步操作：如果只是获取一个数据，
fetch+async/await会更简单直接。 - 对包体积非常敏感的项目：RxJS 有一定的体积，如果你的项目非常小，且对包大小有极致要求，需要慎重考虑。
- 团队成员不熟悉 FRP：RxJS 有一定的学习曲线。如果团队成员不愿意或没有时间学习，强行引入可能会降低开发效率和代码质量。
1.4 响应式宣言 (The Reactive Manifesto)
RxJS 的思想根植于“响应式宣言”。理解其核心原则有助于我们更好地掌握 RxJS。
- Responsive (及时响应): 系统应尽可能及时地做出响应。
- Resilient (弹性): 系统在出现故障时仍能保持响应。
- Elastic (可伸缩): 系统在不同的工作负载下仍能保持响应。
- Message Driven (消息驱动): 依赖异步消息传递来建立组件之间的边界。
RxJS 通过其异步、非阻塞、基于消息（事件）的特性，帮助我们构建满足这些原则的应用程序。
