rxjs(reactive x)

官网：https://rxjs.dev/api

关于subscription
https://blog.csdn.net/weixin_26643379/article/details/108892234

参考链接：
https://reactive.how/ 可视化对比视频动画
https://segmentfault.com/a/1190000013186747

rxjs: 一组用来处理异步或事件的 js 函式库

核心概念：

rxjs是一个使用观察者模式来整合异步操作和事件系统的js库，通过一系列可观测的流（observable）将它们串联起来。
Observable是这个库的核心类型，此外还包括诸如Observer，Schedulers，Subjects等类型。
还包括一些和数组方法类似或经过演化的操作符，用来协助处理数据。

在rxjs中用来处理异步事件的核心概念包括：

• observable: 代表了未来可能会产生的一系列的值或事件的集合；
• observer: 回调函数的集合，它知道如何去处理observable上产生的值或者事件，当然也包括异常。
• subscription: 代表当前正在订阅的observable，主要作用是用来取消订阅行为。
• operators: 纯函数，以函数式的风格通过各种各样的操作符相互配合对observable上产生的数据集合进处理。
• subject: 相当于一个事件发射器，允许将相同的值传递给多个订阅者。
• schedulers: 协调observable上数据的发射方式。

示例：

在javascript中通常使用以下方式来注册事件：

var button = document.querySelector('button');

button.addEventListener('click', () => console.log('Clicked'));

使用rxjs的方式实现如下：

var button = document.querySelector('button');

Rx.Observable.fromEvent(button, 'click')
    .subscribe(() => console.log('Clicked'));

image.png

subscribe return 的回调值就是subscriotion
观察者一般是个函数

image.png

有人订阅，观察行为才会启动
并不是有观察者就行，必须要有subscribe去订阅！！！！
unsubscribe 取消订阅后，不会再触发订阅

image.png