RxJS - Neueste Updates

In diesem Tutorial verwenden wir RxJS Version 6. RxJS wird häufig für die reaktive Programmierung und häufiger für Angular, ReactJS verwendet. Angular 6 lädt standardmäßig rxjs6.

RxJS Version 5 wurde im Vergleich zu Version 6 anders behandelt. Der Code wird unterbrochen, wenn Sie Ihren RxJS 5 auf 6 aktualisieren. In diesem Kapitel werden wir den Unterschied in der Handhabung des Versionsupdates sehen.

Wenn Sie RxJS auf 6 aktualisieren und keine Codeänderungen vornehmen möchten, können Sie dies auch tun und müssen das folgende Paket installieren.

npm install --save-dev rxjs-compact

Dieses Paket sorgt für Abwärtskompatibilität und alter Code funktioniert einwandfrei mit RxJS Version 6. Wenn Sie die Codeänderungen vornehmen möchten, die mit RxJS 6 einwandfrei funktionieren, müssen die folgenden Änderungen vorgenommen werden.

Die Pakete für Betreiber, Observablen und Subjekte wurden umstrukturiert, und daher werden die wichtigsten Änderungen für Importe vorgenommen und im Folgenden erläutert.

Importe für Betreiber

Gemäß Version 5 sollten für Bediener die folgenden Importanweisungen enthalten sein:

import 'rxjs/add/operator/mapTo'
import 'rxjs/add/operator/take'
import 'rxjs/add/operator/tap'
import 'rxjs/add/operator/map'

In RxJS Version 6 werden die Importe wie folgt ausgeführt:

import {mapTo, take, tap, map} from "rxjs/operators"

Import von Methoden zum Erstellen von Observables

Gemäß Version 5 sollten bei der Arbeit mit Observables die folgenden Importmethoden enthalten sein:

import "rxjs/add/observable/from";
import "rxjs/add/observable/of";
import "rxjs/add/observable/fromEvent";
import "rxjs/add/observable/interval";

In RxJS Version 6 werden die Importe wie folgt ausgeführt:

import {from, of, fromEvent, interval} from 'rxjs';

Import von Observablen

In RxJS Version 5 sollten während der Arbeit mit Observables die folgenden Importanweisungen enthalten sein:

import { Observable } from 'rxjs/Observable'

In RxJS Version 6 werden die Importe wie folgt ausgeführt:

import { Observable } from 'rxjs'

Import des Betreffs

In RxJS Version 5 sollte der Betreff wie folgt enthalten sein:

import { Subject} from 'rxjs/Subject'

In RxJS Version 6 werden die Importe wie folgt ausgeführt:

import { Subject } from 'rxjs'

Wie verwende ich Operatoren in RxJS 6?

pipe() methodist auf dem beobachtbaren erstellten verfügbar. Es wird ab Version 5.5 zu RxJS hinzugefügt. Mit pipe () können Sie jetzt mehrere Operatoren in aufeinanderfolgender Reihenfolge bearbeiten. So wurden die Operatoren in RxJS Version 5 verwendet.

Beispiel

import "rxjs/add/observable/from";
import 'rxjs/add/operator/max'

let list1 = [1, 6, 15, 10, 58, 2, 40];
from(list1).max((a,b)=>a-b).subscribe(x => console.log("The Max value is "+x));

Ab RxJS Version 5.5 müssen wir pipe () verwenden, um den Operator auszuführen -

Beispiel

import { from } from 'rxjs';
import { max } from 'rxjs/operators';

from(list1).pipe(max((a,b)=>a-b)).subscribe(x => console.log(
   "The Max value is "+x)
);

Operatoren umbenannt

Während der Umstrukturierung der Pakete wurden einige der Operatoren umbenannt, da sie mit Javascript-Schlüsselwörtern in Konflikt standen oder mit diesen übereinstimmten. Die Liste ist wie folgt:

Operator	Umbenannt in
tun()	Zapfhahn()
Fang()	catchError ()
Schalter()	switchAll ()
schließlich()	finalize ()
werfen()	throwError ()