Versprechen und async/await sind neue Funktionen in JavaScript, die es ermöglichen, mit asynchronen Operationen einfacher und verständlicher zu arbeiten. Diese Konzepte kamen in die Sprache, um mit dem Problem umzugehen, das die Asynchronität verursacht – die Komplexität der Verwaltung und Verarbeitung der Ergebnisse von asynchronen Operationen.
In der JavaScript–Welt können viele Operationen einige Zeit in Anspruch nehmen - das Hochladen von Dateien, das Senden von Anfragen an den Server, das Ausführen von asynchronem Code usw.
Wenn eine asynchrone Operation ausgeführt wird, wartet JavaScript normalerweise nicht darauf, dass sie beendet wird, sondern springt sofort zum nächsten. Daher ist das Ergebnis der asynchronen Arbeit nicht sofort verfügbar, sondern wird später verfügbar. Und hier kommen sie zur Rettung Versprechen und async/await.
Versprechen, async/await: Grundprinzipien der Arbeit
Das Funktionsprinzip von Promise ist wie folgt:
- Promise erstellen: Es wird eine neue Promise-Instanz erstellt, die eine Executor-Funktion mit zwei Argumenten akzeptiert: resolve und reject.
- Ausführung der Operation: Innerhalb der ausführenden Funktion wird eine asynchrone Operation ausgeführt. Wenn die Operation erfolgreich ausgeführt wurde, wird die Funktion resolve aufgerufen und das Ergebnis der Operation an sie übergeben. Im Falle eines Fehlers wird die reject-Funktion aufgerufen und das Fehlerobjekt an sie übergeben.
- Ergebnisverarbeitung: Nach Ausführung eines Vorgangs kann sich Promise in einem von drei Zuständen befinden: Warten (pending), abgeschlossen (fulfilled) oder abgelehnt (rejected). Abhängig vom Promise-Status werden die entsprechenden Handler aufgerufen, die mit den Methoden then (zur Verarbeitung des erfolgreichen Ergebnisses) und catch (zur Fehlerbehandlung) festgelegt werden können.
async/await ist ein syntaktischer Zucker für die Arbeit mit asynchronem Code, der in ECMAScript 2017 eingeführt wurde. Es ermöglicht Ihnen, asynchronen Code sequentiell zu schreiben und hat eine einfachere Struktur als die Verwendung von Promise.
Funktionsweise von async/await:
- Asynchrone Funktionsdeklaration: Eine Funktion, die das async-Schlüsselwort verwendet, wird asynchron und kann await-Anweisungen enthalten.
- Verwenden des await-Operators: die await-Anweisung unterbricht die Ausführung einer asynchronen Funktion, bis die Promis mit dem Ergebnis ausgeführt wird oder mit einem Fehler zurückgewiesen wird. Der vom await-Operator zurückgegebene Wert ist das Ergebnis einer Promis.
- Verarbeitung des Ergebnisses: das von Promis zurückgegebene Operationsergebnis kann zur weiteren Arbeit in einer Variablen gespeichert oder direkt im Code der asynchronen Funktion verwendet werden.
Die Verwendung von Promise und async/await ermöglicht eine einfachere Arbeit mit asynchronem Code, wodurch er lesbarer und wartbarer wird. Sie sind leistungsstarke Tools für die Entwicklung von Anwendungen, die eine asynchrone Ausführung von Operationen und die Verarbeitung von Ergebnissen erfordern.
Versprechen und Asynchronität: Was ist es und wie funktioniert es?
Das Arbeiten mit Promis ist besonders nützlich, wenn Sie Vorgänge ausführen müssen, die viel Zeit in Anspruch nehmen, z. B. Anfragen an den Server oder das Lesen einer großen Datei. Anstatt die Ausführung des Programms zu blockieren und auf den Abschluss des Vorgangs zu warten, können Sie Promis verwenden und andere Aufgaben fortsetzen, bis der Vorgang abgeschlossen ist.
Promis haben drei Zustände: Warten (pending), erfüllt (fulfilled) und abgelehnt (rejected). Wenn eine Promis erstellt wird, befindet sie sich im ausstehenden Zustand und kann dann als Ergebnis eines asynchronen Vorgangs ausgeführt oder abgelehnt werden.
Eine Promis wird mit dem Promise-Konstruktor erstellt:
const promise = new Promise((resolve, reject) =>/ выполнение асинхронной операции. if (успех) else >);
Innerhalb des Promise-Konstruktors wird eine Funktion übergeben, die eine asynchrone Operation enthält. Innerhalb dieser Funktion müssen Sie entweder die Resolve-Funktion aufrufen, wenn die Operation erfolgreich ausgeführt wurde, oder die reject-Funktion ist fehlgeschlagen, wenn die Operation fehlgeschlagen ist.
Wenn die Promis abgeschlossen ist, können Sie mithilfe von Methoden einen Handler an sie anhängen.then() und .catch() . Methode.then() wird aufgerufen, wenn die Promis erfolgreich ausgeführt wurde, und gibt das Ergebnis des Vorgangs sowie die Methode zurück .catch() wird aufgerufen, wenn eine Promis abgelehnt wird und gibt einen Fehler zurück.
Beispiel für die Verwendung von Promis:
function getData() , 2000);>);>getData().then((result) => ).catch((error) => );