Observable: Methode toArray()

Syntax

toArray()
toArray(options)

Parameter

options Optional

Ein Optionsobjekt mit den folgenden Eigenschaften:

signal Optional

Ein AbortSignal, mit dem der Vorgang abgebrochen werden kann. Wird das Signal abgebrochen, endet das Abonnement der Quelle, und das Promise wird mit der reason des Signals zurückgewiesen. Ist das Signal bereits abgebrochen, wird das Promise zurückgewiesen, ohne die Quelle zu abonnieren.

Rückgabewert

Ein Promise, das nach Abschluss der Quelle mit einem neuen Array erfüllt wird. Das Array enthält alle Werte der Quelle in der Reihenfolge ihrer Ausgabe. Schließt die Quelle ab, ohne Werte auszugeben, wird das Promise mit einem leeren Array erfüllt.

Tritt in der Quelle ein Fehler auf, wird das Promise mit diesem Fehler zurückgewiesen. Wird der Vorgang abgebrochen, wird das Promise mit dem Abbruchgrund zurückgewiesen.

Beschreibung

Wie andere Operatoren, die ein Promise zurückgeben, abonniert diese Methode die Quelle sofort beim Aufruf. Ein separater Aufruf von subscribe() ist nicht erforderlich.

toArray() speichert jeden Wert der Quelle, bis diese abgeschlossen ist. Wird die Quelle nie abgeschlossen, bleibt das Promise ausstehend, sofern kein Fehler auftritt und der Vorgang nicht abgebrochen wird. Das Array wächst dann mit jedem eintreffenden Wert weiter. Verwenden Sie bei Bedarf take() oder takeUntil(), um den Stream zu begrenzen.

Werte der Quelle werden unverändert gespeichert. Ist ein Wert ein Promise, enthält das Array dieses Promise-Objekt und nicht den Wert, mit dem es erfüllt wird.

Beispiele

Verwendung von toArray()

Dieses Beispiel sammelt die Koordinaten der ersten drei Klicks auf eine Schaltfläche und zeigt sie als Array in der Reihenfolge der Klicks an. Klicken Sie nach dem Ende des Streams auf „Restart“, um es erneut zu versuchen.

<button>Click me</button>
<p>Waiting for clicks</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 clicks";
  btn
    .when("click")
    .take(3)
    .map((event) => ({ x: event.clientX, y: event.clientY }))
    .toArray()
    .then((result) => {
      restart.disabled = false;
      output.textContent = JSON.stringify(result);
    });
}

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

Spezifikationen

Browser-Kompatibilität

Siehe auch

• Observables verwenden
• Erläuterung zu Observable