Detaillierte Erklärung von Promises in JavaScript

Detaillierte Erklärung von Promises in JavaScript

Promise ist eine Lösung für asynchrone Programmierung. Es ist ein Objekt, das Nachrichten von asynchronen Vorgängen abrufen kann. Es verbessert die Schwierigkeiten der asynchronen Programmierung erheblich und vermeidet die Callback-Hölle. Es ist vernünftiger und leistungsfähiger als herkömmliche Lösungen wie Callback-Funktionen und Ereignisse.

Syntaktisch ist ein Promise ein Objekt, das Nachrichten von asynchronen Operationen empfangen kann. Bietet eine einheitliche API, sodass verschiedene asynchrone Vorgänge auf die gleiche Weise gehandhabt werden können

1. Promise-Instanzen haben drei Zustände:

(1) Ausstehend

(2) Gelöst

(3) Abgelehnt

2. Promise-Instanzen haben zwei Prozesse

(1) ausstehend > erfüllt: gelöst

(2) pending > rejected: Abgelehnt

Hinweis: Sobald sich der Status von „Kauf und Verkauf“ zu einem anderen Status ändert, kann er nicht mehr geändert werden.

Grundlegende Verwendung von Promise:

1. Erstellen Sie ein Promise-Objekt

Das Promise-Objekt stellt eine asynchrone Operation dar und hat drei Zustände: ausstehend (in Bearbeitung), erfüllt (erfolgreich) und abgelehnt (fehlgeschlagen).

Der Promise-Konstruktor akzeptiert eine Funktion als Parameter, deren beiden Parameter „resolve“ und „reject“ sind.

2. Promise-Methode

Promise hat fünf gängige Methoden:

(1)dann()

Die then-Methode kann zwei Callback-Funktionen als Parameter erhalten. Die erste Callback-Funktion wird aufgerufen, wenn sich der Status des Promise-Objekts in „Resolved“ ändert, und die zweite Callback-Funktion wird aufgerufen, wenn sich der Status des Promise-Objekts in „Rejected“ ändert. Der zweite Parameter kann weggelassen werden.

lass versprechen = neues Versprechen((lösen, ablehnen)=>{
    ajax('erste').Erfolg(Funktion(res){
        Entschlossenheit (res);
    })
})
versprechen.dann(res=>{
    gib ein neues Versprechen zurück ((Auflösen,Ablehnen)=>{
        ajax('Sekunde').Erfolg(Funktion(Res){
            Entschlossenheit (res)
        })
    })
}).dann(res=>{
    gib ein neues Versprechen zurück ((Auflösen,Ablehnen)=>{
        ajax('Sekunde').Erfolg(Funktion(Res){
            Entschlossenheit (res)
        })
    })
}).dann(res=>{
 })

(2) fangen ()

Diese Methode entspricht dem zweiten Parameter der then-Methode und verweist auf die Reject-Callback-Funktion.

Eine weitere Funktion besteht darin, dass bei der Ausführung der Resolve-Callback-Funktion, wenn ein Fehler auftritt und eine Ausnahme ausgelöst wird, die Ausführung nicht gestoppt wird, sondern in die Catch-Methode wechselt.

p.then((Daten) => {
     console.log('gelöst',Daten);
},(err) => {
     console.log('abgelehnt',Fehler);
     }
); 
p.then((Daten) => {
    console.log('gelöst',Daten);
}).catch((err) => {
    console.log('abgelehnt',Fehler);
});

(3) alle()

Die Methode all kann Aufgaben abschließen und ausführen. Sie empfängt ein Array und jedes Element im Array ist ein Promise-Objekt. Wenn alle Promise-Zustände im Array aufgelöst sind, wird der Zustand aller Methoden aufgelöst, falls ein Zustand abgelehnt wird. Der Status aller Methoden ändert sich dann zu „Abgelehnt“.

JavaScript
let promise1 = neues Versprechen((lösen, ablehnen)=>{
	setzeTimeout(()=>{
       Entschlossenheit (1);
	},2000)
});
let promise2 = neues Versprechen((lösen, ablehnen)=>{
	setzeTimeout(()=>{
       Entschlossenheit (2);
	},1000)
});
let promise3 = neues Versprechen((lösen, ablehnen)=>{
	setzeTimeout(()=>{
       Entschlossenheit (3);
	},3000)
});
Versprechen.alle([Versprechen1,Versprechen2,Versprechen3]).dann(res=>{
    konsole.log(res);
    //Das Ergebnis ist: [1,2,3] 
})

(4) empfangen()

Die Empfangsmethode ist dieselbe wie bei allen und der empfangene Parameter ist ein Array von Promises. Im Gegensatz zu allen wird jedoch bei Ausführung des ersten Ereignisses der Wert des Promise-Objekts direkt zurückgegeben.

Die eigentliche Funktion von rece: Wenn Sie etwas tun möchten, aber nach langer Zeit aufgeben, können Sie das Problem mit dieser Methode lösen.

Versprechen.race([Versprechen1, TimeOutPromise(5000)]).dann(res=>{})

(5) schließlich()

Mit der Finally-Methode wird eine Operation angegeben, die unabhängig vom Endzustand des Promise-Objekts ausgeführt wird. (Diese Methode wurde im ES2018-Standard eingeführt)

versprechen
.dann(Ergebnis => {···})
.catch(Fehler => {···})
.finally(() => {···});

Die Callback-Funktion der Finally-Methode akzeptiert keine Parameter, d. h. es besteht keine Möglichkeit herauszufinden, ob der vorherige Promise-Status erfüllt oder abgelehnt wurde.

versprechen
.finally(() => {
  // Anweisungen });
// entspricht Versprechen
.Dann(
  Ergebnis => {
    // Anweisung gibt Ergebnis zurück;
  },
  Fehler => {
    //Anweisung löst Fehler aus;
  }
);

Wenn im obigen Code die Finally-Methode nicht geschrieben ist, muss die gleiche Anweisung sowohl für den Erfolg als auch für den Fehler einmal geschrieben werden. Mit der finally-Methode müssen Sie es nur einmal schreiben

Zusammenfassen

Dieser Artikel endet hier. Ich hoffe, er kann Ihnen helfen. Ich hoffe auch, dass Sie mehr Inhalt auf 123WORDPRESS.COM lesen können!

Das könnte Sie auch interessieren:
  • Ein tiefer Einblick in JavaScript-Promises
  • Front-End-JavaScript-Versprechen
  • Fragen zum Vorstellungsgespräch zu JS 9 Promise
  • So fügen Sie in JS eine Abbruchfunktion zu einem Versprechen hinzu
  • Verstehen Sie das Versprechen von JavaScript gründlich

<<:  Zusammenfassung von 4 Methoden des Div+CSS-Layouts, um eine 2-Enden-Ausrichtung von CSS zu erreichen

>>:  Achten Sie bei der Webseitenerstellung auf die Verwendung von HTML-Tags

Artikel empfehlen

WePY-Cloud-Entwicklungspraxis im Linux-Befehlsabfrage-Applet

Hallo zusammen, heute werde ich mit Ihnen die WeP...

So konfigurieren Sie den Nginx-Lastausgleich

Inhaltsverzeichnis Nginx-Lastausgleichskonfigurat...

Drei Möglichkeiten zur Implementierung virtueller Hosts unter Linux7

1. Gleiche IP-Adresse, unterschiedliche Portnumme...

CSS-Isolationsproblem in Blazor

1. Umwelt VS 2019 16.9.0 Vorschau 1.0 .NET SDK 5....

CSS3 verwendet var()- und calc()-Funktionen, um Animationseffekte zu erzielen

Wissenspunkte in der Vorschau anzeigen. Animation...

Zusammenfassung der 11 häufigsten Fehler von MySQL-Anfängern

Vorwort Sie erhalten möglicherweise häufig Warn-E...

Tutorial zur Installation von mysql5.7.17 über yum auf redhat7

Die Linux-Betriebssysteme der RHEL/CentOS-Reihe v...

Grundkenntnisse in HTML: ein erstes Verständnis von Webseiten

HTML ist die Abkürzung für Hypertext Markup Langua...

Drei nützliche Codes, damit sich Besucher an Ihre Website erinnern

Drei nützliche Codes, die Besuchern dabei helfen,...

Mehrere Möglichkeiten zum Ändern der SELECT-Optionen in einer HTML-Dropdown-Box

Nachdem das Formular übermittelt wurde, wird die z...