深入理解RxJS

175 阅读2分钟

RxJS 的起源需要追溯到响应式编程(RP),后续产生了一系列基于响应式编程范式的语言扩展(Rx,RxJS 就是其中之一),请看历史简谱(左向右延续)。

响应式编程

image.png

概念

响应式编程,Reactive Programing,又称反应式编程,简称 RP,是一种面向数据流和变化传播的声明式编程范式。这意味着可以在编程语言中很方便地表达静态或动态的数据流,而相关的计算模型会自动将变化的值通过数据流进行传播。

响应式带来的好处:当更新结果发生变化时自动通知调用者,而不用轮询重试

核心思想

从传统的调用方“拉”数据的思维模式转变为被调用方“推”数据的思维模式。

JS异步编程历史

  • callback
  • Promise:一旦声明它会立即执行并修改它的执行状态,这源于它的实现,因此无法监听和打断Promise状态;
  • Generator:处于 Promise 和 Async/await 之间的产物,它给我们带来了写异步语法像写同步一般,只需在函数前加 * 修饰。但流程管理不方便(迭代器模式实现,主动调 next 执行器流转游标);
  • Async/await:Generator 语法糖,既保留了语法上的优势,也解决了 Generator 每步要调一下 next 执行器的弊端,是现阶段的最佳方案。

RxJS

概念

RxJS 全称 Reactive Extensions for JavaScript,翻译过来是 Javascript 的响应式扩展,它是一个采用流来处理异步和事件的工具库,简单来说 Rx(JS) = Observables + Operator + Scheduler

使用(擅长)

  • UI 事件:例如鼠标移动、按钮单击......
  • 状态管理:例如属性更改、集合更新等事件
  • IO 消息事件:服务监听
  • 广播/通知:消息总线(Event bus)
  • 网络消息/事件:例如 HTTP、WebSockets API 或其他低延迟中间件