Reaktive Programmierung mit Javascript

Question

Ich bin neu in der reaktiven Programmierung und ich bin ein wenig verloren Lesen all dieser Artikel, die ich nicht verstehen kann.

Eigentlich bin ich ein JavaScript-Entwickler von Nodejs, Angularjs, Angular 2 und React.

Was ich

verwende ich verspricht die ganze Zeit, für die Datenfernabruf, lokale Asynchron-Auflösung etc ... Bessere Prüfbarkeit als Rückrufe und meine Bedürfnisse anzupassen.

Was ich verstehen Streams mit

ich kann nicht herausfinden, wo Ströme mich außer in einem bestimmten Fall speichern.

Dieser spezielle Fall ist, dass ich Versprechungen beim Anhören von Streams nicht verwenden kann, weil das Versprechen nur einmal gelöst werden würde.

Ein Beispiel mit SocketIo:

io.on('connection', (socket) => { 
    // this works 
}); 

io.on('connection').then((socket) => { 
    // this can't work, promise would be resolved only once 
}); 

Wenn ich nicht falsch bin, ich reaktive Ströme nutzen könnte, diesen Fall zu verwalten, indem sie einfach eine beobachtbare zurück. Recht ?

Was ich nicht verstehe

I Angular 2 und das ganze Zeug um studiere. In vielen Blogs verwenden Leute Observable, um entfernte Daten zu holen, und ich kann nicht verstehen, was ein Vorteil sein könnte, wenn ich sie anstelle von Versprechungen verwende.

Tatsache ist, dass ich eine Fernbedienung wie in beiden Fällen machen müsste, also warum mehr als die andere? Ist das ein Leistungsproblem?

Was ich

benötigen Wenn Sie die ganze Frage gelesen habe, was ich brauche, ist zu verstehen, was sind die Vorteile der Verwendung von reaktiver Programmierung statt Versprechungen im Fall von Remote-Daten holen?

In welchen (anderen Fällen) könnte es besser sein, reaktive Sachen als normale Sachen zu verwenden?

Answer 1

Wenn Sie ein einzelnes asynchrones Ereignis haben, über das Sie benachrichtigt werden möchten (Rückruf), verwenden Sie Promise. Wenn Sie erwarten, eine Reihe von Veranstaltungen Observable

Vorteile von Observable über Promise verwenden

• beobachtbare abgebrochen werden kann
• beobachtbar sind faul (tun nichts vor abonniert werden)
• beobachtbare Dose tun, was Promise kann, aber nur mit Observable können Sie den gleichen Weg (mit RX-Operatoren statt egal ob Sie eine oder eine Reihe von Ereignissen erwarten.

Answer 2

@ Günter gab Ihnen die Grundlagen von Observablen vor allem die Fähigkeit, Versprechen zu heißen.

Um ein bisschen weiter zu gehen, denke ich, dass der Hauptvorteil von Observablen die Fähigkeit ist, einen asynchronen Datenfluss/-strom unter Verwendung von Operatoren zu erstellen.

Hier sind einige konkrete Anwendungsfälle:

• debounceTime/switchMap. Wenn Sie eine Formulareingabe verwenden möchten, um eine Liste basierend auf den entsprechenden HTTP-Anforderungen zu filtern, müssen Sie den Wert für die Anforderung verwenden, wenn der Benutzer mit dem Schreiben fertig ist. Es ist nicht notwendig, mehrere Anfragen zu senden: eine pro neue Zeichen (eins für 's', eins für 'so', eins für 'som', ..., eins für 'etwas zu suchen'). Der Operator debounceTime ermöglicht dies durch Zwischenspeichern von Ereignissen und stellt den letzten nach einer bestimmten Inaktivitätszeit bereit. Hier

  ist ein Beispiel:

  @Component({ 
      (...) 
      template: ` 
      <input [ngFormControl]="ctrl"/> 
      ` 
  }) 
  export class MyComponent { 
      constructor() { 
      this.ctrl = new Control(); 
      this.ctrl.valueChanges 
         .debounceTime(500) 
         .distinctUntilChanged() 
         .switchMap((vallue: string) => { 
         // Get data according to the filled value 
         return this.service.getData(entry); 
         }) 
         .subscribe(data => { 
         // Update the linked list 
         this.list = data; 
         }); 
      } 
  } 
  

  Wenn Sie nur switchMap verwenden, werden Sie eine Anfrage pro Eingang haben aber vorherigen in-progress-Anfragen werden annulliert. Dies ermöglicht Ihnen, das richtige Ergebnis zu erhalten, insbesondere wenn die Ausführungszeiten für einige Anforderungen länger sind.

  In diesem Fall können Sie das Ereignis aus der Webbenutzerschnittstelle (DOM-Ereignisse) mit HTTP-Anforderungen verknüpfen, um entsprechend auszuführen (auf Ereignisse reagieren) und einige erweiterte Verhaltensweisen anzuwenden.

• Implement retry. Durch Mischen retryWhen, delay und timeout Operatoren können Sie einfach (und transparent) implementieren Wiederholungen

  searchPlaces(searchText:string) { 
      var params = new URLSearchParams(); 
      params.set('placename_startsWith', searchText); 
      params.set('username', 'templth'); 
  
      return this.http.get('http://api.geonames.org/postalCodeSearchJSON', 
       { search: params }) 
      .retryWhen(error => error.delay(500)) 
      .timeout(2000, return new Error('delay exceeded')) 
      .map(res => res.json().postalCodes); 
  } 
  

denke ich, dass dies die wahre Macht von Observablen ist: der asynchrone Verarbeitung Kette/Datenfluss und verknüpfen verschiedene Teile der Anwendung basierend auf Ereignissen. Es ist etwas, das mit Versprechungen nicht gemacht werden kann und es ermöglicht, Anwendungsfälle zu implementieren, um Ihre Anwendung robuster zu machen.

Hier ist eine Reihe von Artikeln, die Ihnen mehr Details geben könnte:

• https://jaxenter.com/reactive-programming-http-and-angular-2-124560.html
• http://slides.com/robwormald/everything-is-a-stream
• https://gist.github.com/staltz/868e7e9bc2a7b8c1f754