Arten von Versprechen in JavaScript

Verzeihen Sie mir die Tipp- und Grammatikfehler, ich lerne immer noch. ?

Was sind Versprechen?

Versprechen sind eine Möglichkeit, asynchrone Vorgänge in JavaScript abzuwickeln. Sie stellen einen Wert dar, der jetzt, in der Zukunft oder nie verfügbar sein kann. Versprechen haben drei Zustände: ausstehend, erfüllt und abgelehnt.

Arten von Versprechen

1. Ausstehend: Der Anfangszustand eines Versprechens. Es bedeutet, dass der Vorgang noch läuft und noch nicht abgeschlossen ist.

2. Erfüllt: Der Zustand eines Versprechens, wenn der Vorgang erfolgreich abgeschlossen wurde. Das Versprechen hat einen Wert und kann genutzt werden.

3. Abgelehnt: Der Status eines Versprechens, wenn der Vorgang fehlgeschlagen ist. Das Versprechen hat einen Grund für das Scheitern und kann mit der Catch-Methode behandelt werden.

Warum Versprechen wichtig sind?

• Promises hilft dabei, saubereren und besser lesbaren asynchronen Code zu schreiben.
• Sie bieten eine Möglichkeit, asynchrone Vorgänge strukturierter abzuwickeln.
• Promises können miteinander verkettet werden, um mehrere asynchrone Vorgänge nacheinander auszuführen.
• Ob beim Abrufen von Daten, beim Bewältigen mehrerer Aufgaben oder beim Rennen um das schnelle Ergebnis, Versprechen sind in modernem JavaScript unerlässlich.

1. Einfaches Versprechen

const promise = new Promise((resolve, reject) => {
    // Imagine fetching user data from an API
    const user = {
        name: "Aasim Ashraf",
        age: 21,
    };

    user ? resolve(user) : reject("User not found");
});

promise
    .then((user) => console.log(user))
    .catch((error) => console.log(error));

Ein Versprechen, das häufig für API-Aufrufe oder asynchrone Aufgaben verwendet wird.

• Verwendungszweck: Für einen einzelnen asynchronen Vorgang wie das Abrufen von Daten von einer API.
• Vorteile:Saubere Abwicklung von Erfolg und Misserfolg in einem Block.

2. Promise.all Mehrfachoperationen

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.all([fetchUser, fetchPosts])
    .then(([user, posts]) => {
        console.log(user, posts);
    })
    .catch((error) => console.log(error));

Wartet darauf, dass alle Versprechen eingelöst werden. Wenn eines scheitert, scheitert die gesamte Kette. Am besten für mehrere asynchrone Aufgaben geeignet, die gemeinsam gelöst werden müssen.

• Verwendungszweck: Für mehrere asynchrone Vorgänge, die nicht voneinander abhängig sind.
• Vorteile: Mehrere Daten gleichzeitig abrufen und gemeinsam verarbeiten.
• Nachteile:Wenn einer scheitert, scheitern alle.

Was passiert, wenn ein Versprechen in Promise.all fehlschlägt?

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.all([fetchUser, fetchPosts])
    .then(([user, posts]) => {
        console.log(user, posts);
    })
    .catch((error) => console.log(error));

Das Problem bei Promise.all besteht darin, dass die gesamte Kette scheitert, wenn ein Versprechen fehlschlägt. Um dies zu vermeiden, können Sie Promise.allSettled.

verwenden

3. Promise.allSettled

const fetchUser = fetch("/users").then((res) => res.json());
const fetchPosts = fetch("/posts").then((res) => res.json());

Promise.allSettled([fetchUser, fetchPosts])
    .then((results) => {
        results.forEach((result) => {
            if (result.status === "fulfilled") {
                console.log("User Data:", result.value);
            } else {
                console.log("Error:", result.reason);
            }
        });
    });

Promise.allSettled wartet darauf, dass alle Versprechen erfüllt werden, unabhängig davon, ob sie gelöst oder abgelehnt werden. Es gibt ein Array von Objekten mit einem Status und einem Wert oder Grund zurück.

• Wann zu verwenden:Wenn Sie alle Ergebnisse wissen möchten, auch Fehler.
• Vorteile: Mehrere Daten gleichzeitig abrufen und gemeinsam verarbeiten.
• Nachteile:Wenn einer ausfällt, wird die Kette nicht gestoppt

4. Promise.race Schnellstes Ergebnis

const fast = new Promise(resolve => setTimeout(resolve, 1000, "Fast"));

const slow = new Promise(resolve => setTimeout(resolve, 2000, "Slow"));

Promise.race([fast, slow])
    .then((result) => {
        console.log(result);
    })
    .catch((error) => console.log(error));

Gibt das Ergebnis des ersten Abwicklungsversprechens zurück, unabhängig davon, ob es gelöst oder abgelehnt wurde. Nützlich, wenn Sie Geschwindigkeit benötigen, z. B. beim Laden der ersten verfügbaren Antwort.

• Wann zu verwenden:Wenn Geschwindigkeit wichtiger ist als das Warten auf alle Ergebnisse.
• Limit: Möglicherweise erhalten Sie eine Fehlermeldung, wenn das schnellste Versprechen fehlschlägt.

Was passiert, wenn ein Versprechen in Promise.race fehlschlägt?

const error = new Promise((resolve) => {
    setTimeout(() => resolve("Error"), 1000);
});

const success = new Promise((resolve) => {
    setTimeout(() => resolve("Success"), 2000);
});

Promise.race([error, success])
    .then((result) => {
        console.log(result);
    })
    .catch((error) => console.log("First Rejected",error));

Wenn das erste Versprechen scheitert, scheitert die gesamte Kette. Um dies zu vermeiden, können Sie Promise.any.

verwenden

5. Versprechen Sie jedes erste erfolgreiche Ergebnis

const promise1 = Promise.reject("Error 1");
const promise2 = new Promise(resolve => setTimeout(resolve, 3000, "Promise 2"));

Promise.any([promise1, promise2])
    .then((result) => {
        console.log("First Success",result);
    })
    .catch((error) => console.log("All Rejected",error));

Wird aufgelöst, wenn ein Versprechen gelöst wird. Ignoriert alle Ablehnungen, bis alle Versprechen abgelehnt sind. Nützlich, wenn Sie unabhängig vom Rest das erste erfolgreiche Ergebnis benötigen.

• Wann zu verwenden:Wenn Sie das erste erfolgreiche Ergebnis benötigen, unabhängig von den restlichen Versprechen.
• Limit: Wenn alle Versprechen abgelehnt werden, wird ein Fehler ausgegeben.

Rekapitulieren

• Einfaches Versprechen: Für einen einzelnen asynchronen Vorgang wie das Abrufen von Daten von einer API.
• Promise.all: Für mehrere asynchrone Vorgänge, die nicht voneinander abhängig sind.
• Promise.allSettled:Wenn Sie alle Ergebnisse wissen möchten, auch Fehler.
• Promise.race:Wenn Geschwindigkeit wichtiger ist als das Warten auf alle Ergebnisse.
• Promise.any:Wenn Sie das erste erfolgreiche Ergebnis benötigen, unabhängig von den restlichen Versprechen.

Letzte Gedanken

• Die Wahl der richtigen Art von Versprechen ist der Schlüssel zu einer effizienten asynchronen Programmierung.
• Verwenden Sie das Versprechen, das am besten zu Ihrem Anwendungsfall passt: Geschwindigkeit, mehrere Vorgänge oder Verarbeitung aller Ergebnisse.

Das obige ist der detaillierte Inhalt vonArten von Versprechen in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!