Betreff vs BehaviorSubject vs ReplaySubject in Angular

Ich habe versucht, diese 3 zu verstehen:

Betreff , Verhaltensthema und Wiederholungsfach . Ich möchte sie verwenden und wissen, wann und warum, welche Vorteile sie haben, und obwohl ich die Dokumentation gelesen, Tutorials angesehen und Google durchsucht habe, habe ich keinen Sinn daraus gemacht.

Was ist ihr Zweck? Ein realer Fall wäre sehr dankbar, wenn er nicht einmal codieren müsste.

Ich würde eine saubere Erklärung vorziehen, nicht nur "a + b => c, das Sie abonniert haben ..."

Danke dir

Es kommt wirklich auf Verhalten und Semantik an. Mit einer

• Subject- Ein Abonnent erhält nur veröffentlichte Werte, die nach dem Abonnement ausgegeben wurden. Fragen Sie sich, ist es das, was Sie wollen? Muss der Abonnent etwas über vorherige Werte wissen? Wenn nicht, können Sie dies verwenden, andernfalls wählen Sie eine der anderen. Zum Beispiel bei der Kommunikation von Komponente zu Komponente. Angenommen, Sie haben eine Komponente, die Ereignisse für andere Komponenten auf Knopfdruck veröffentlicht. Sie können einen Dienst mit einem Betreff zur Kommunikation verwenden.

• BehaviorSubject- Der letzte Wert wird zwischengespeichert. Ein Abonnent erhält beim ersten Abonnement den neuesten Wert. Die Semantik für dieses Thema besteht darin, einen Wert darzustellen, der sich im Laufe der Zeit ändert. Zum Beispiel ein angemeldeter Benutzer. Der ursprüngliche Benutzer kann ein anonymer Benutzer sein. Sobald sich ein Benutzer anmeldet, ist der neue Wert der authentifizierte Benutzerstatus.

  Das BehaviorSubjectwird mit einem Anfangswert initialisiert. Dies ist manchmal wichtig für die Codierungspräferenz. Angenommen, Sie initialisieren es mit a null. Dann müssen Sie in Ihrem Abonnement eine Nullprüfung durchführen. Vielleicht OK oder vielleicht nervig.

• ReplaySubject- Es kann bis zu einer bestimmten Anzahl von Emissionen zwischengespeichert werden. Alle Abonnenten erhalten beim Abonnement alle zwischengespeicherten Werte. Wann würden Sie dieses Verhalten brauchen? Ehrlich gesagt hatte ich keine Notwendigkeit für ein solches Verhalten, außer im folgenden Fall:

  Wenn Sie a ReplaySubjectmit einer Puffergröße von initialisieren 1, verhält es sich tatsächlich wie a BehaviorSubject. Der letzte Wert wird immer zwischengespeichert, sodass er sich wie ein Wert verhält, der sich im Laufe der Zeit ändert. Damit ist keine nullPrüfung erforderlich, wie im Fall der BehaviorSubjectmit a initialisierten null. In diesem Fall wird bis zur ersten Veröffentlichung kein Wert an den Abonnenten ausgegeben.

Es kommt also wirklich auf das Verhalten an, das Sie erwarten (für welches Sie es verwenden möchten). Die meiste Zeit werden Sie wahrscheinlich eine verwenden wollen, BehaviorSubjectweil das, was Sie wirklich darstellen möchten, die Semantik "Wert über Zeit" ist. Aber ich persönlich sehe nichts falsches an der Ersetzung von ReplaySubjectinitialisiert durch 1.

Was Sie vermeiden möchten, ist die Verwendung der Vanille, Subjectwenn Sie wirklich ein Caching-Verhalten benötigen. Nehmen wir zum Beispiel, Sie schreiben einen Routing Guard oder eine Lösung. Sie rufen einige Daten in diesem Guard ab und legen sie in einem Dienst fest Subject. Dann abonnieren Sie in der gerouteten Komponente den betreffenden Dienst, um zu versuchen, den Wert zu erhalten, der im Guard ausgegeben wurde. Hoppla. Wo ist der Wert? Es wurde bereits ausgestrahlt, DUH. Verwenden Sie ein "Caching" -Thema!

Siehe auch:

• Was sind die RxJS-Probanden und welche Vorteile bietet ihre Verwendung?

Eine handliche Zusammenfassung der verschiedenen beobachtbaren Typen, nicht intuitive Benennung, die ich kenne lol .

• Subject - Ein Abonnent erhält erst nach Abschluss des Abonnements veröffentlichte Werte.
• BehaviorSubject - Neue Abonnenten erhalten unmittelbar nach dem Abonnement den zuletzt veröffentlichten Wert ODER den Anfangswert.
• ReplaySubject - Neue Abonnenten erhalten alle zuvor veröffentlichten Werte sofort nach dem Abonnement

1. Betreff : Beim Abonnieren werden immer die Daten abgerufen, die nach dem Abonnement übertragen werden, dh frühere Push-Werte werden nicht empfangen .

const mySubject = new Rx.Subject();

mySubject.next(1);

const subscription1 = mySubject.subscribe(x => {
  console.log('From subscription 1:', x);
});

mySubject.next(2);

const subscription2 = mySubject.subscribe(x => {
  console.log('From subscription 2:', x);
});

mySubject.next(3);

subscription1.unsubscribe();

mySubject.next(4);

In diesem Beispiel ist hier das Ergebnis, das in der Konsole gedruckt wird:

From subscription 1: 2
From subscription 1: 3
From subscription 2: 3
From subscription 2: 4

Beachten Sie, dass Abonnements, die zu spät eintreffen, einige der Daten verpassen, die in den Betreff verschoben wurden.

2. Themen wiedergeben : Kann helfen, indem ein Puffer mit vorherigen Werten aufbewahrt wird, die an neue Abonnements ausgegeben werden.

Hier ist ein Verwendungsbeispiel für Wiedergabethemen, bei denen a buffer of 2 previous valuesfür neue Abonnements beibehalten und ausgegeben wird:

const mySubject = new Rx.ReplaySubject(2);

mySubject.next(1);
mySubject.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);
});

Folgendes gibt uns das an der Konsole:

From 1st sub: 3
From 1st sub: 4
From 1st sub: 5
From 2nd sub: 4
From 2nd sub: 5

3. Verhaltenssubjekte : ähneln Wiederholungssubjekten, geben jedoch nur den zuletzt ausgegebenen Wert oder einen Standardwert erneut aus, wenn zuvor kein Wert ausgegeben wurde:

const mySubject = new Rx.BehaviorSubject('Hey now!');

mySubject.subscribe(x => {
  console.log('From 1st sub:', x);
});

mySubject.next(5);

mySubject.subscribe(x => {
  console.log('From 2nd sub:', x);
});

Und das Ergebnis:

From 1st sub: Hey now!
From 1st sub: 5
From 2nd sub: 5

Referenz: https://alligator.io/rxjs/subjects/

Aus: Randall Koutnik Buch „Erstellen Sie reaktive Websites mit RxJS.“ ::

Ein Subjekt ist ein Objekt, das mit Turbolader beobachtet werden kann. Im Kern verhält sich ein Betreff ähnlich wie ein reguläres Observable, aber jedes Abonnement ist an dieselbe Quelle gebunden. Die Probanden sind auch Beobachter und verfügen über Next-, Error- und Doed-Methoden, um Daten gleichzeitig an alle Abonnenten zu senden. Da Subjekte Beobachter sind, können sie direkt an einen Abonnementanruf weitergeleitet werden, und alle Ereignisse aus dem ursprünglichen Observable werden über das Subjekt an seine Abonnenten gesendet.

Wir können das ReplaySubject verwenden, um den Verlauf zu verfolgen. Ein ReplaySubject zeichnet die letzten n Ereignisse auf und sendet sie an jeden neuen Abonnenten zurück. Zum Beispiel in der Chat-Anwendung. Wir können es verwenden, um die Aufzeichnung des vorherigen Chat-Verlaufs zu verfolgen.

Ein BehaviorSubject ist eine vereinfachte Version des ReplaySubject . Das ReplaySubject hat eine beliebige Anzahl von Ereignissen gespeichert, das BehaviorSubject zeichnet nur den Wert des letzten Ereignisses auf. Wenn ein BehaviorSubject ein neues Abonnement aufzeichnet, gibt es den neuesten Wert an den Abonnenten sowie alle neu übergebenen Werte aus. Das BehaviorSubject ist nützlich, wenn es sich um einzelne Statuseinheiten handelt, z. B. Konfigurationsoptionen.

Die am meisten befürwortete Antwort ist eindeutig falsch und behauptet:

"Wenn Sie a ReplaySubjectmit einer Puffergröße von 1 initialisieren , verhält es sich tatsächlich wie a. BehaviorSubject"

Das ist nicht ganz richtig; In diesem großartigen Blog-Beitrag erfahren Sie, welche Unterschiede zwischen diesen beiden bestehen. Wenn Sie beispielsweise einen abgeschlossenen abonnieren BehaviorSubject, erhalten Sie nicht den letzten Wert, sondern einen ReplaySubject(1).

Dies ist ein wichtiger Unterschied, der nicht übersehen werden sollte:

const behavior = new BehaviorSubject(null);
const replay = new ReplaySubject(1);

behavior.skip(1).subscribe(v => console.log('BehaviorSubject:', v));
replay.subscribe(v => console.log('ReplaySubject:', v));

behavior.next(1);
behavior.next(2);
behavior.complete();
behavior.subscribe(v => console.log('Late B subscriber:', v));

replay.next(1);
replay.next(2);
replay.complete();
replay.subscribe(v => console.log('Late R subscriber:', v));

Überprüfen Sie dieses Codebeispiel hier, das aus einem anderen großartigen Blog-Beitrag zum Thema stammt.

     // ***********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")

• Betreff - Ein Abonnent erhält erst nach Abschluss des Abonnements veröffentlichte Werte.
• BehaviorSubject - Neue Abonnenten erhalten unmittelbar nach dem Abonnement den zuletzt veröffentlichten Wert ODER den Anfangswert.