认识Rxjs#

宝岛台湾的大佬JerryHong 30天精通RxJS

1.异步编程增多#

在网页的世界中,存取任何资源都是异步的

异步意味着发送一个获取文件请求,必须等到文件获取结束,才能进行操作

随着业务复杂化,编写异步代码的需求更多,同时也更困难.

2.异步带来新的问题#

• 竞态条件(Race Condition)
• 内存泄漏(Memory Leak)
• 复杂的状态(Complex State)
• 报错处理(Exception Handling)
• 异步API多种多样

DOM Events
XMLHttpRequest
fetch
WebSockets
Server Send Events
Service Worker
Node Stream
Timer

面对日益复杂的问题,我们需要一个更好的解决方法

3.RxJS 是什么#

• RxJS 是一套使用 观察者队列(Observable sequences) 来组合 异步行为 和 事件基础 的 库.
• RxJS 被称为 函数响应式编程 Function Reactive Programming(FPR) ,更确切的说是 函数编程(Functional Programming) 跟 响应式编程(Reactive Programming) 的結合.

RxJS 使用示例

监听点击事件,点击一次后不再监听

//原生 JavaScript
var handler = (e) => {
 console.log(e);
 document.body.removeEventListener('click', handler); // 結束監聽
}
document.body.addEventListener('click', handler);

// 使用 Rx 大概的樣子
Rx.Observable
 .fromEvent(document.body, 'click') // 註冊監聽
 .take(1) // 只取一次
 .subscribe(console.log);

可以认为RxJS是处理异步的Lodash.
异步行为 和 事件基础 不是很清楚具体是指什么
RxJS 被称为 FPR有争议, 并且 FPR 与 Functional Programming 跟 Reactive Programming 的結合 概念不同.
简单说就是FPR 是操作随时间连续改变的数值,而Rx则比较像随时间发出离散的数值.这部分不用太过深究,因为RPR本身的定义及其解释也存在争议.
30天精通RxJS 文章的作者JerryHong 认为 编程思想是想法的集合,而非严格的指南, 因而该更宽松的看待FPR的定义, 所以更偏向于 直接称其为FPR ,避免困惑.

4.Functional Reactive Programming 是什么#

Functional Reactive Programming 是一种编程思想(programming paradigm),就是编程的方法论.
比如,OOP就是一种编程思想,告诉我们使用对象的方式来思考.

其 包含了 响应式编程 及 函数编程 两种编程思想.

(1) Functional Programming 函数式编程#

用函数的方式来思考我们的问题.

(2) Reactive Programming 响应式编程#

响应式编程 就是当变量或者说资源发生变动,由变量或资源主动告诉依赖项,我发生变动了.

其背后隐含两件事:

• 发生变动,即非同步,因为不知道什么时候会发生变动.
• 主动告知,表示不需要专门编写用于 通知 依赖者的代码(响应式库已经写好了)

当我们使用Vue 开发的时候, 只要绑定的变量一改变,相关的变量及画面就会自动变化.
不需要开发者编写如何 通知 每个依赖者或者记录依赖者 的代码.
这样,开发者就只需要关注于 如果发生变化,要做什么事,这就是典型的 响应式编程.

响应式编程 只是一种编程思想,很多库都有用到,不止RxJS,比如Vue就是响应式编程的典范之一

5.总结#

RxJS 是异步处理方案,有更优雅更便捷的书写方式.
RxJS 吸收了 函数式编程 和 响应式编程 的编程思想.