RxJS 系列 – Subject
前言
RxJS 两大概念 Observable 和 Subject. 上一篇介绍了 Observable 这篇继续接受 Subject.
参考
RxJS 建立 Observable 的基礎 - Observable / Subject / BehaviorSubject / ReplaySubject / AsyncSubject
介绍
Subject 是典型的观察者模式, 它不是 Observable 那样参杂了 Generator Function 概念, 所以比较容易理解.
当我们说 Subject extends Observable 时, 指的是它可以被订阅. 而不是它拥有所有 Observable 的特性哦.
和 Observable 不同的地方
第一个不同是它们发布的方式.
Observable 的发布逻辑是在初始化方法里面通过 subscriber.next 发布的.
Subject 没有初始化方法. 它这个对象自带 .next 方法来实现发布
第二个不同是 multiple subscribe
Observable multiple subscribe 会参数多条独立的 stream.
Subjust multiple subscribe 则不会产生多条 stream. 每次 subscurbe 它只是把 callback 函数存起来, 发布时挨个调用而已 (典型的观察者模式实现)
Subject 创建与订阅
const subject = new Subject(); subject.subscribe({ next: () => console.log('next'), complete: () => console.log('complete'), }); subject.next(''); subject.complete();
简单明了, 和常见的 addEventListener 一样的逻辑.
BehaviorSubject
stream 是一个值一段时间内的变化.
Subject 只是事件发布. 它表达不了 stream 概念. 于是就有了 BehaviorSubject
const bSubject = new BehaviorSubject<string>('init value'); bSubject.subscribe(value => console.log(value)); // 直接触发拿到 init value console.log(bSubject.value); // 获取当前 value bSubject.next('new value'); // update value 同时发布给所有 subscriber
有了 BehaviorSubject 它就像一个可被监听的 variable 了.
ReplaySubject
ReplaySubject 的作用是把 value cache 起来. 当订阅的时候可以直接获取所有 cached values
const rSubject = new ReplaySubject<string>(1); // cache 1 个值, 也可以 cahce 多个 rSubject.next('first value'); // 输入 init value rSubject.subscribe(v => console.log(v)); // 立刻拿到 init value rSubject.next('second value'); // 更新 cached value 同时发布
上面这个例子类似于 BehaviorSubject 的功能. 但 BehaviorSubject 可以 .value 获取当前的 value. ReplaySubject 却不能.
所以它替代不了 BehaviorSubject 哦
AsyncSubject
AsyncSubject 我没有用过. 它很特别.
每当 subject.next 的时候它不会发布.
一直到 subject.complete 被调用后, 它才会把最后一个 next value 发布出去
const aSubject = new AsyncSubject<string>(); aSubject.subscribe({ next: v => console.log('next', v), // after .complete() this will be call value is 'b' }); aSubject.next('a'); aSubject.next('b'); aSubject.complete();
asObservable
Subject 虽然可以被订阅, 但它也具备发布的功能. 如果我们想让它变成 readonly 只能订阅不能发布可以使用 asObservable
const bSubject = new BehaviorSubject<string>('init value'); const value$ = bSubject.asObservable(); // value$ 只能订阅, 不能发布 value$.subscribe(v => console.log(v)); bSubject.next('next value'); // 发布
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· CSnakes vs Python.NET:高效嵌入与灵活互通的跨语言方案对比
· DeepSeek “源神”启动!「GitHub 热点速览」
· 我与微信审核的“相爱相杀”看个人小程序副业
· Plotly.NET 一个为 .NET 打造的强大开源交互式图表库
· 上周热点回顾(2.17-2.23)