我一直在寻找了解这 3 个:
主题
行为主体
重播主题
我想使用它们并知道何时以及为什么,使用它们有什么好处,尽管我已经阅读了文档,观看了教程并搜索了谷歌,但我对此没有任何意义。
那么他们的目的是什么?一个真实的案例将不胜感激,它甚至不必编码。
我希望有一个清晰的解释,而不仅仅是“a+b => c you are subscribed to ....”
谢谢
它实际上归结为行为和语义。带一个
主题 - 订阅者只会获得订阅后发出的发布值。问问自己,这是你想要的吗?订阅者是否需要了解有关先前值的任何信息?如果没有,那么您可以使用它,否则选择其他之一。例如,组件到组件的通信。假设您有一个组件在单击按钮时发布其他组件的事件。您可以使用带有主题的服务进行通信。
BehaviorSubject - 最后一个值被缓存。订阅者将在初始订阅时获得最新值。该主题的语义是表示随时间变化的值。例如登录用户。初始用户可能是匿名用户。但是一旦用户登录,那么新值就是经过身份验证的用户状态。 BehaviorSubject 用一个初始值初始化。这有时对编码偏好很重要。例如,假设您使用 null 对其进行初始化。然后在您的订阅中,您需要进行空检查。也许没问题,也许很烦人。
ReplaySubject - 它可以缓存指定数量的发射。任何订阅者都将在订阅时获得所有缓存的值。你什么时候需要这种行为?老实说,我不需要这种行为,除了以下情况:如果你初始化一个缓冲区大小为 1 的 ReplaySubject,那么它的行为实际上就像一个 BehaviorSubject。最后一个值总是被缓存,所以它就像一个随时间变化的值。有了这个,就不需要像使用空值初始化的 BehaviorSubject 那样进行空值检查。在这种情况下,在第一次发布之前,不会向订阅者发送任何值。
所以它真的归结为你所期望的行为(至于使用哪一个)。大多数情况下,您可能想要使用 BehaviorSubject
,因为您真正想要表示的是“随时间变化的价值”语义。但我个人认为用 1
初始化的 ReplaySubject
替换没有任何问题。
当您真正需要的是一些缓存行为时,您要避免 使用普通 Subject
。例如,您正在编写路由保护或解析。您在该守卫中获取一些数据并将其设置在服务 Subject
中。然后在路由组件中订阅服务主题以尝试获取在防护中发出的值。哎呀。价值在哪里?它已经发出了,DUH。使用“缓存”主题!
也可以看看:
什么是 RxJS 主题以及使用它们的好处?
主题:订阅时它总是获取订阅后推送的数据,即未收到之前推送的值。
const mySubject = new Rx.Subject();我的主题.next(1); const subscription1 = mySubject.subscribe(x => { console.log('来自订阅 1:', x); });我的主题.next(2); const subscription2 = mySubject.subscribe(x => { console.log('来自订阅 2:', x); }); mySubject.next(3);订阅1.取消订阅(); mySubject.next(4);
在此示例中,以下是将在控制台中打印的结果:
From subscription 1: 2
From subscription 1: 3
From subscription 2: 3
From subscription 2: 4
请注意,迟到的订阅如何丢失一些已推送到主题中的数据。
重播主题:可以通过保留将发送给新订阅的先前值的缓冲区来提供帮助。
以下是重播主题的使用示例,其中保留并在新订阅上发出 buffer of 2 previous values
:
const mySubject = new Rx.ReplaySubject(2);我的主题.next(1);我的主题.next(2); mySubject.next(3); mySubject.next(4); mySubject.subscribe(x => { console.log('From 1st sub:', x); }); mySubject.next(5); mySubject.subscribe(x => { console.log('From 2nd sub:', x); });
这是在控制台上给我们的:
From 1st sub: 3
From 1st sub: 4
From 1st sub: 5
From 2nd sub: 4
From 2nd sub: 5
行为主题:类似于重放主题,但只会重新发出最后发出的值,或者如果之前没有发出任何值,则重新发出默认值:
const mySubject = new Rx.BehaviorSubject('嘿现在!'); mySubject.subscribe(x => { console.log('From 1st sub:', x); }); mySubject.next(5); mySubject.subscribe(x => { console.log('From 2nd sub:', x); });
结果:
From 1st sub: Hey now!
From 1st sub: 5
From 2nd sub: 5
参考:https://alligator.io/rxjs/subjects/
对不同可观察类型的方便总结,我知道的非直观命名哈哈。
主题 - 订阅者只会在订阅后获得发布的值。
BehaviorSubject - 新订阅者在订阅后立即获得最后发布的值或初始值。
ReplaySubject - 新订阅者在订阅后立即获得所有先前发布的值
最受欢迎的答案显然是错误的,声称:
“如果您初始化一个缓冲区大小为 1 的 ReplaySubject
,那么它的行为实际上就像一个 BehaviorSubject
”
这并不完全正确。检查this great blog post这两者之间的差异。例如,如果您订阅已完成的 BehaviorSubject
,您将不会收到最后一个值,但对于 ReplaySubject(1)
,您将收到最后一个值。
这是一个不容忽视的重要区别:
常量行为 = 新的 BehaviorSubject(null); const replay = new ReplaySubject(1); behavior.skip(1).subscribe(v => console.log('BehaviorSubject:', v)); replay.subscribe(v => console.log('ReplaySubject:', v));行为.next(1);行为.next(2);行为.完成(); behavior.subscribe(v => console.log('Late B 订阅者:', v));重播.next(1);重播.next(2);重播.完成(); replay.subscribe(v => console.log('Rate R 订阅者:', v));
查看来自 another great blog post 的代码示例 here。
来自:Randall Koutnik 的书“使用 RxJS 构建响应式网站”。 :
Subject 是一个涡轮增压的 observable 对象。从本质上讲,Subject 的行为很像常规的 observable,但每个订阅都连接到同一个源。 Subject 也是观察者,并且有 next、error 和 done 方法来一次向所有订阅者发送数据。因为 subject 是观察者,所以可以直接将它们传递到 subscribe 调用中,来自原始 observable 的所有事件都将通过 subject 发送给它的订阅者。
我们可以使用 ReplaySubject 来跟踪历史。 ReplaySubject 记录最后 n 个事件并将它们回放给每个新订阅者。例如在聊天应用程序中。我们可以用它来跟踪以前的聊天记录。
BehaviorSubject 是 ReplaySubject 的简化版本。 ReplaySubject 存储任意数量的事件,BehaviorSubject 只记录最新事件的值。每当 BehaviorSubject 记录新订阅时,它都会向订阅者发出最新值以及传入的任何新值。在处理单个状态单元(例如配置选项)时,BehaviorSubject 很有用。
正如一些帖子中提到的,自 BehaviorSubject != ReplaySubject(1)
以来接受的答案是错误的,这不仅仅是编码风格的偏好。
在评论中经常提到“守卫”,这也是我最常发现重播主题用例的地方。更具体地说,如果您有类似 take(1)
的场景,并且您不想只取初始值。
检查例如以下内容:
ngOnInit() {
const behaviorSubject = new BehaviorSubject<boolean>(null);
const replaySubject = new ReplaySubject<boolean>(1);
this.checkLoggedIn(behaviorSubject, 'behaviorSubject');
this.checkLoggedIn(replaySubject, 'replaySubject');
behaviorSubject.next(true);
replaySubject.next(true);
}
checkLoggedIn($userLoggedIn: Observable<boolean>, id: string) {
$userLoggedIn.pipe(take(1)).subscribe(isLoggedIn => {
if (isLoggedIn) {
this.result[id] = 'routed to dashboard';
} else {
this.result[id] = 'routed to landing page';
}
});
}
结果:
{
"behaviorSubject": "routed to landing page",
"replaySubject": "routed to dashboard"
}
在这些情况下,您显然需要一个 ReplaySubject
!工作代码:https://stackblitz.com/edit/replaysubject-vs-behaviorsubject?file=src%2Fapp%2Fapp.component.ts
// ***********Subject concept ***********
let subject = new Subject<string>();
subject.next("Eureka");
subject.subscribe((data) => {
console.log("Subscriber 1 got data >>>>> "+ data);
});
subject.subscribe((data) => {
console.log("Subscriber 2 got data >>>>> "+ data);
});
// ********behaviour subject*********
// Behavior subjects need a first value
let subject1 = new BehaviorSubject<string>("First value");
subject1.asObservable().subscribe((data) => {
console.log("First subscriber got data behaviour subject>>>>> "+ data);
});
subject1.next("Second value")
主题 - 订阅者只会在订阅后获得发布的值。
BehaviorSubject - 新订阅者在订阅后立即获得最后发布的值或初始值。
ReplaySubject
正是我所需要的。我有一个需要该值的路由守卫,但需要等待第一次发射。所以BehaviorSubject
没有削减它,因为我不想要一个初始值(null
也不起作用,因为我用它来表示一个状态)ReplaySubject
,那么它的行为实际上就像一个BehaviorSubject
”:这并不完全正确;检查this great blog post这两者之间的差异。例如,如果您订阅已完成的BehaviorSubject
,您将不会收到最后一个值,但对于ReplaySubject(1)
,您将收到最后一个值。