Heim > Web-Frontend > js-Tutorial > Hauptteil

Asynchrone Programmierung – Rückrufe, Versprechen und Async Await

WBOY
Freigeben: 2024-09-11 06:43:02
Original
1079 Leute haben es durchsucht

Asynchronous programming Callbacks, Promises & Async Await

Asynchrone Programmierung in JavaScript ermöglicht es Ihnen, Aufgaben wie API-Aufrufe durchzuführen, Dateien zu lesen oder Datenbanken abzufragen, ohne die Ausführung anderen Codes zu blockieren. Dies ist in JavaScript von entscheidender Bedeutung, insbesondere in der Webentwicklung, wo Reaktionsfähigkeit und Leistung entscheidend sind.

Schlüsselkonzepte

1. Rückrufe:

Eine Funktion, die als Argument an eine andere Funktion übergeben wird und nach Abschluss einer asynchronen Operation ausgeführt wird.

Beispiel:

Funktion fetchData(callback) {
setTimeout(() => {
callback("Daten abgerufen");
}, 1000);
}

fetchData((data) => {
console.log(data);
});

2. Versprechen:

Ein Objekt, das den eventuellen Abschluss oder Misserfolg eines asynchronen Vorgangs darstellt.

Ein Versprechen kann einen von drei Zuständen haben: ausstehend, erfüllt oder abgelehnt.

Beispiel:

let versprochen = neues Versprechen((auflösen, ablehnen) => {
setTimeout(() => {
lösen("Daten abgerufen");
}, 1000);
});

Versprochen
.then((data) => console.log(data))
.catch((error) => console.log(error));

3. asynchron und warten:

Asynchrone Funktionen geben automatisch ein Versprechen zurück und werden verwendet, um die Handhabung von Versprechen zu vereinfachen.

await unterbricht die Ausführung einer asynchronen Funktion, bis das Versprechen aufgelöst ist, wodurch der Code einfacher zu lesen und zu schreiben ist.

Beispiel:

asynchrone Funktion fetchData() {
versuche es mit {
let data = auf neues Versprechen warten((auflösen, ablehnen) => {
setTimeout(() => {
lösen("Daten abgerufen");
}, 1000);
});
console.log(data);
} Catch (Fehler) {
console.log(error);
}
}

fetchData();

Asynchrone Muster

Rückrufhölle: Eine Situation, in der Rückrufe in anderen Rückrufen verschachtelt sind, was das Lesen und Warten des Codes erschwert.

Promise Chaining: Ein Muster, um die Callback-Hölle zu vermeiden, indem Versprechen zurückgegeben und die Methoden .then() und .catch() verkettet werden.

Async/Await: Ein modernerer und saubererer Ansatz zum Schreiben von asynchronem Code, der die Verkettung von Versprechen vermeidet und den Code synchroner aussehen lässt.

Anwendungsfälle

API-Aufrufe: Daten von einem Server abrufen.

Timer: Mit setTimeout oder setInterval.

Dateioperationen: Dateien auf nicht blockierende Weise lesen oder schreiben.

Ereignisbehandlung: Verarbeitung von Ereignissen wie Klicks, Tastendrücken usw.

Asynchrone Programmierung in JavaScript ist für die Erstellung reaktionsfähiger, effizienter Anwendungen unerlässlich, insbesondere wenn es um E/A-gebundene Vorgänge geht.

Das obige ist der detaillierte Inhalt vonAsynchrone Programmierung – Rückrufe, Versprechen und Async Await. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage