Observable: Statische Methode from()

Syntax

Observable.from(value)

Parameter

value

Ein Objekt, das in ein Observable umgewandelt werden soll: ein Observable, ein Promise, ein iterierbares Objekt oder ein asynchron iterierbares Objekt.

Rückgabewert

Ein Observable. Wenn value bereits ein Observable ist, wird es unverändert zurückgegeben. Andernfalls wird ein neues Observable zurückgegeben, das beim Abonnieren Werte aus value ausgibt.

Ausnahmen

TypeError

Wird ausgelöst, wenn value nicht in ein Observable umgewandelt werden kann. Primitive Werte, einschließlich Strings, werden nicht akzeptiert.

Beschreibung

Bei der Umwandlung wird zuerst geprüft, ob bereits ein Observable vorliegt, dann, ob es sich um ein Async Iterable, danach um ein Iterable und schließlich um ein Promise handelt.

• Ein Promise liefert seinen Erfüllungswert und anschließend eine Abschlussbenachrichtigung. Eine Zurückweisung wird zu einem Fehler.
• Ein Iterable liefert seine Werte synchron und anschließend eine Abschlussbenachrichtigung, wenn der Iterator erschöpft ist.
• Ein Async Iterable liefert seine Werte, sobald sie verfügbar sind, und anschließend eine Abschlussbenachrichtigung, wenn der Iterator erschöpft ist.

Fehler während der Iteration werden zu Fehlern im Observable.

Der Aufruf von from() abonniert das zurückgegebene Observable nicht. Bei der Umwandlung eines bestehenden Promise wird die Arbeit, durch die es erstellt wurde, jedoch nicht aufgeschoben. Auch das Abbestellen bricht diese Arbeit nicht ab. Wenn das Promise zurückgewiesen wird, nachdem der Abonnent inaktiv geworden ist, wird der Fehler an das globale Objekt gemeldet.

Viele Methoden, die Observables entgegennehmen, etwa Observable.takeUntil(), wandeln ihr Argument implizit in ein Observable um. Sie können daher auch Promises, Iterables und Async Iterables übergeben.

Beispiele

Ein synchrones Iterable umwandeln

Der Aufruf von from() erstellt das Observable, ohne die Iteration zu starten. In diesem Beispiel werden beim Abonnieren alle Array-Werte und die Abschlussbenachrichtigung ausgegeben, bevor subscribe() zurückkehrt:

const observable = Observable.from([1, 2, 3]);

console.log("Before subscribing");
observable.subscribe({
  next(value) {
    console.log(value);
  },
  complete() {
    console.log("Complete");
  },
});
console.log("After subscribing");

// Before subscribing
// 1
// 2
// 4
// Complete
// After subscribing

Ein Promise umwandeln

Dieses Beispiel wandelt ein Promise für den ersten Klick auf die Schaltfläche in ein Observable um. Es zeigt die Koordinaten des Klicks und anschließend eine Abschlussmeldung an. Klicken Sie nach dem Ende des Streams auf „Neustart“, um es erneut zu versuchen.

<button>Click me</button>
<p>Waiting for a click</p>
<button id="restart" disabled>Restart</button>

const btn = document.querySelector("button");
const output = document.querySelector("p");
const restart = document.querySelector("#restart");

function start() {
  restart.disabled = true;
  output.textContent = "Waiting for a click";
  const firstClick = btn.when("click").first();

  Observable.from(firstClick).subscribe({
    next(event) {
      output.textContent = `${event.clientX},${event.clientY}`;
    },
    complete() {
      restart.disabled = false;
      output.textContent += " — Complete.";
    },
  });
}

restart.when("click").subscribe(start);
start();

Ein Async Iterable umwandeln

Dieses Beispiel protokolliert Textabschnitte aus einer abgerufenen Datei. Der decodierte ReadableStream ist ein Async Iterable. Jeder Abschnitt kann einen Teil einer Zeile oder mehrere Zeilen enthalten.

const response = await fetch("/data.txt");
if (!response.ok) {
  throw new Error(`Request failed: ${response.status}`);
}

const textStream = response.body.pipeThrough(new TextDecoderStream());

Observable.from(textStream).subscribe({
  next(chunk) {
    console.log(chunk);
  },
  error(error) {
    console.error("Reading failed:", error);
  },
  complete() {
    console.log("Stream complete");
  },
});

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Observables verwenden
• Erläuterung zu Observables