• Zuhause
  • Artikel
  • Eine Einführung in die Themen der reaktiven Programmierung
Veröffentlicht am 10-03-2019

Eine Einführung in die Themen der reaktiven Programmierung

Ein Intro zu Themen

Ein Betreff ist ein "spezieller" Beobachtungsbereich, der die Übertragung von Werten an mehrere Abonnenten ermöglicht. Das Timing spielt vor allem für die erfolgreiche Übertragung von Daten eine wichtige Rolle. Wenn ein Beobachter sich zum Beispiel spät anmeldet, greift er nicht auf frühere Daten zu. Glücklicherweise gibt es jedoch vier Arten von Betreffs, die Funktionen hinzufügen, um Szenarien zu verwalten, bei denen wir auf alle vorherigen Daten zugreifen oder die letzten Daten abrufen können.

Themen, die wir behandeln werden:

  1. Was ist ein Betreff? (ein praktisches Intro)
  2. BehaviorSubject: Liefert die letzte Nachricht
  3. ReplaySubject: Zeitreise
  4. AsyncSubject: Wenn Sie fertig sind, erhalten Sie die letzte Nachricht

1. Was ist ein Betreff?

Wie bereits erwähnt, ist ein Subjekt nicht mehr ein beobachtbares Merkmal mit ein paar weiteren Merkmalen. Ein beobachtbares Element ist definitionsgemäß eine aufrufbare Sammlung, die nach dem Abonnieren Daten ausstrahlt. In einem Subjekt steuern wir den Status "Wann Daten ausgeben" an mehrere Abonnenten.

Mit einem Betreff können wir Methoden wie .next (), .complete () und .error () außerhalb aufrufen, während wir in einem Observable diese Methoden als Rückrufe aufrufen.

Praktisches Beispiel: Lassen Sie uns eine einfache Chat-Gruppe mit einem Betreff erstellen

Stellen wir uns vor, wir erstellen eine einfache Chat-App, in der Benutzer Nachrichten an die Chat-Gruppe senden können. Im ersten Schritt erstellen Sie eine Instanz des Betreffs und weisen diese einer ChatGroup zu.

Nachdem unsere Chatgruppe (Betreff) erstellt wurde, müssen Sie als Nächstes Nachrichten hinzufügen. Lassen Sie uns ein typisches Gespräch zwischen zwei Personen erstellen.

So weit so gut - jetzt haben wir 4 Nachrichten in unserer Chat-Gruppe. Was passiert, wenn wir abonnieren? Oder nehmen wir an, ein neuer Freund namens John möchte am Gespräch teilnehmen. Wird er das gesamte Gespräch sehen können?

Leider nicht, John vermisst das Gespräch, weil er zu spät ist. Die Nachrichten wurden hinzugefügt, bevor er abonniert wurde. Dies ist ein perfektes Beispiel für die Funktionsweise der reaktiven Programmierung - die Vorstellung von Werten, die im Zeitablauf verlaufen.

Um zu veranschaulichen, wenn John mitten in die Konversation eintritt, platzieren wir einfach den Abonnementpunkt wie folgt:

Sobald John abonniert hat, sieht er die beiden letzten Nachrichten. Das Subjekt tut, was es tun soll. Aber was ist, wenn wir möchten, dass John auch alte Konversationen anzeigt oder nur die letzten oder vielleicht immer dann, wenn eine Nachricht vorliegt, wird er aktualisiert?

Hier sind andere Arten von Fächern praktisch, also schauen wir uns an, was wir tun können.

Es gibt 4 Arten von Fächern

  1. Betreff (bereits beschrieben)
  2. BehaviorSubject
  3. ReplaySubject
  4. AsyncSubject

Im Allgemeinen sind sie einander ähnlich, außer dass jede für einen bestimmten Anwendungsfall zusätzliche Funktionen bietet.

2. BehaviorSubject: Letzte Nachricht abrufen

Das BehaviorSubject ähnelt einem Betreff, außer dass ein Anfangswert als Argument erforderlich ist, um den Anfangspunkt des Datenstroms zu markieren. Der Grund dafür ist, dass beim Abonnieren die letzte Nachricht zurückgegeben wird. Dazu muss es die Größe des Datenstroms kennen. Das gleiche Konzept wie bei Arrays, bei dem wir array.length-1 verwenden, um den neuesten Wert zu erhalten.

3. ReplaySubject: Zeitreise

Das ReplaySubject überträgt, wie der Name schon sagt, nach dem Abonnieren alle Nachrichten, auch wenn wir es verspätet haben oder nicht. Es ist wie eine Zeitreise, bei der wir auf alle übertragenen Werte zugreifen können.

4. AsyncSubject: Wenn Sie fertig sind, erhalten Sie die letzte Nachricht

Das AsyncSubject ähnelt BehaviorSubject in Bezug auf das Ausgeben des letzten Werts nach dem Abonnieren. Der einzige Unterschied besteht darin, dass eine vollständige Methode () erforderlich ist, um den Stream als abgeschlossen zu markieren. Sobald dies geschehen ist, wird der letzte Wert ausgegeben.

Zusammenfassung

Zurück zu unserem vorherigen Beispiel mit John können wir nun entscheiden, ob John auf die gesamte Konversation (ReplaySubject), die letzte Nachricht (BehaviorSubject) oder die letzte Nachricht zugreifen soll, wenn die Konversation abgeschlossen ist (AsyncSubject).

Wenn Sie Schwierigkeiten haben, herauszufinden, ob ein Subjekt der richtige Weg ist, beschreibt der Artikel „Verwenden eines Subjekts oder Nicht-Verwenden eines Subjekts“ von Dave Sixton, wann Subjekte auf zwei Kriterien basieren:

  1. Nur wenn man ein kaltes Observable in ein heißes Observable umwandeln will.
  2. Generieren Sie ein heißes Observable, das kontinuierlich Daten überträgt.

Im Allgemeinen begrenzt nur Kreativität den potenziellen Einsatz reaktiver Programmierung. Es wird einige Szenarien geben, in denen Observables die meiste Last auf sich zieht, aber wenn Sie wissen, welche Subjekte sind und welche Art von Subjekten vorhanden sind, verbessern Sie Ihre Fähigkeiten im Umgang mit reaktiver Programmierung.

Wenn Sie mehr über das Web-Ökosystem erfahren möchten, hier ein paar Artikel, die ich geschrieben habe, um Ihre Webfähigkeiten zu verbessern.

  • Ein Vergleich zwischen Angular und React
  • Eine praktische Anleitung zu ES6-Modulen
  • So führen Sie HTTP-Anforderungen mithilfe der Fetch-API durch
  • Wichtige Webkonzepte zum Lernen
  • Steigern Sie Ihre Fähigkeiten mit diesen JavaScript-Methoden
  • Erstellen Sie benutzerdefinierte Bash-Befehle

Sie finden mich auf Medium, wo ich wöchentlich publiziere. Oder Sie können mir auf Twitter folgen, wo ich relevante Tipps und Tricks zur Webentwicklung posten kann.

P.S. Wenn Ihnen dieser Artikel gefallen hat und Sie möchten mehr davon, klatschen Sie bitte und teilen Sie es mit Freunden, die es vielleicht brauchen. Es ist gutes Karma.