'of' vs 'from' operator

151

Ist der einzige Unterschied zwischen Observable.ofund Observable.fromdem Argumentformat? Wie das Function.prototype.callund Function.prototype.apply?

Observable.of(1,2,3).subscribe(() => {})
Observable.from([1,2,3]).subscribe(() => {})
Xiaoke
quelle

Antworten:

114

Nicht ganz. Wenn Sie ein Array an übergeben Observable.from, besteht der einzige Unterschied zwischen ihm und Observable.ofder Art und Weise, wie die Argumente übergeben werden.

Allerdings Observable.fromwird ein annehmen Argument , das ist

ein abonnierbares Objekt, ein Versprechen, ein beobachtbares Objekt, ein Array, ein iterierbares oder ein Array-ähnliches Objekt, das konvertiert werden soll

Es gibt kein ähnliches Verhalten für Observable.of- das immer nur Werte akzeptiert und keine Konvertierung durchführt.

Cartant
quelle
193

Es ist wichtig, den Unterschied zwischen ofund frombeim Übergeben einer Array-ähnlichen Struktur (einschließlich Zeichenfolgen) zu beachten :

Observable.of([1, 2, 3]).subscribe(x => console.log(x));

würde das gesamte Array auf einmal drucken.

Andererseits,

Observable.from([1, 2, 3]).subscribe(x => console.log(x));

druckt die Elemente 1 mal 1.

Bei Zeichenfolgen ist das Verhalten dasselbe, jedoch auf Zeichenebene.

Tsvetan Ovedenski
quelle
Was ist, wenn Observable.of (1, 2, 3) .subscribe (x => console.log (x));
Xiaoke
1
@xiaoke Dann sind es sicher 3 separate Emissionen (1, dann 2, dann 3).
Tsvetan Ovedenski
16

Eine weitere interessante Tatsache ist, dass Observable.of ([]) ein leeres Array ist, wenn Sie es abonnieren. Wo wie beim Abonnieren von Observable.from ([]) erhalten Sie keinen Wert.

Dies ist wichtig, wenn Sie eine aufeinanderfolgende Operation mit switchmap ausführen.

Beispiel: Im folgenden Beispiel speichere ich einen Job und dann Websites und kommentiere dann als Stream.

.do((data) => {
            this.jobService.save$.next(this.job.id);
        })
        .switchMap(() => this.jobService.addSites(this.job.id, this.sites)
            .flatMap((data) => {
                if (data.length > 0) {
                    // get observables for saving
                    return Observable.forkJoin(jobSiteObservables);
                } else {
                    **return Observable.of([]);**
                }
            })).do((result) => {
            // ..
        })
        .switchMap(() => this.saveComments())
....

wenn es keine Site zum Speichern gibt, dh; data.length = 0 im Abschnitt addSite gibt der obige Code Observable.of ([]) zurück und speichert dann Kommentare. Wenn Sie es jedoch durch Observable.from ([]) ersetzen, werden die nachfolgenden Methoden nicht aufgerufen.

rxfiddle

Josf
quelle
5

Einzeiliger Unterschied:

       let fruits = ['orange','apple','banana']

from : Geben Sie die Elemente einzeln im Array aus. Beispielsweise

    from(fruits).subscribe(console.log) // 'orange','apple','banana'

of : Das gesamte Array auf einmal ausgeben. Beispielsweise

 of(fruits).subscribe(console.log) //  ['orange','apple','banana']

HINWEIS: der Bediener kann so verhalten von Operator mit Spread - Operator

 of(...fruits).subscribe(console.log) //  'orange','apple','banana'
M Abdullah
quelle
0

from: Erstellen Sie Observable aus Array, Versprechen oder Iterable. Nimmt nur einen Wert an. Bei Arrays, Iterables und Strings werden alle enthaltenen Werte als Sequenz ausgegeben

const values = [1, 2, 3];
from(values); // 1 ... 2 ... 3

of: Erstellen Sie Observable mit variablen Mengen an Werten, geben Sie Werte nacheinander aus, aber Arrays als Einzelwert

const values = [1, 2, 3];
of(values, 'hi', 4, 5); // [1, 2, 3] ... 'hi' ... 4 ... 5
Bjarne Gerhardt-Pedersen
quelle