Heim >Web-Frontend >js-Tutorial >Wie verwende ich „async' und „await' für eine reibungslose asynchrone Programmierung in JavaScript?

Wie verwende ich „async' und „await' für eine reibungslose asynchrone Programmierung in JavaScript?

Mary-Kate Olsen
Mary-Kate OlsenOriginal
2024-10-19 22:38:29569Durchsuche

How to Use 'async' and 'await' for Smooth Asynchronous Programming in JavaScript?

Asynchrone Funktionen in JavaScript mit „async“ und „await“

Asynchrone Programmierung ist im JavaScript-Modell von entscheidender Bedeutung. Wenn asynchrone Vorgänge abgeschlossen sind, ist es üblich, anschließend zusätzlichen Code auszuführen. Bisher wurden hierfür Rückrufe eingesetzt. Allerdings können verschachtelte Rückrufe zur „Rückrufhölle“ führen.

Promises

Promises haben die mit verschachtelten Rückrufen verbundenen Probleme gemildert. Sie ermöglichen die Verkettung durch „Promise Chains“, die eine sauberere Syntax und Fehlerbehandlung ermöglichen. Zum Beispiel:

<code class="javascript">const randomProm = new Promise((resolve, reject) => {
  if (Math.random() > 0.5) {
    resolve('Succes');
  } else {
    reject('Failure');
  }
});

// Promise chain
randomProm
  .then((value) => {
    console.log('inside then1');
    console.log(value);
    return value;
  })
  .then((value) => {
    console.log('inside then2');
    console.log(value);
    return value;
  })
  .catch((value) => {
    console.log('inside catch');
    console.log(value);
  });</code>

Schlüsselwörter „async“ und „await“

Asynchrone Funktionen, auch „asynchrone Funktionen“ genannt, wurden eingeführt, um die asynchrone Programmierung weiter zu vereinfachen . Diesen Funktionen wird das Schlüsselwort „async“ vorangestellt und sie ermöglichen die Verwendung des Schlüsselworts „await“.

await unterbricht die Ausführung der asynchronen Funktion, bis der darin enthaltene Ausdruck (normalerweise ein Promise) festgelegt ist. Die Funktion wird fortgesetzt, sobald der Ausdruck aufgelöst ist. Zum Beispiel:

<code class="javascript">async function myAsyncFunc() {
  try {
    const result = await randomProm;
    console.log(result);
  } catch (error) {
    console.log(error);
  }
}

myAsyncFunc();</code>

In diesem Beispiel ist myAsyncFunc eine asynchrone Funktion, die auf das Ergebnis des randomProm Promise wartet. Sobald das Versprechen aufgelöst oder abgelehnt wird, wird der entsprechende Zweig des Try/Catch-Blocks ausgeführt. Durch die Verwendung von Async und Wait machen wir eine komplexe Rückruflogik überflüssig und verbessern die Lesbarkeit des Codes.

Das obige ist der detaillierte Inhalt vonWie verwende ich „async' und „await' für eine reibungslose asynchrone Programmierung in JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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