Asynchrone Programmierung in Javascript

JavaScript ist eine Single-Threaded-Sprache und kann jeweils nur eine Aufgabe verarbeiten. Dies kann bei komplexen Aufgaben zu langen Wartezeiten führen, da das Skript erst dann andere Aufgaben ausführen kann, wenn es abgeschlossen ist. Um dieses Problem zu lösen, bietet JavaScript asynchrone Programmierung, die es dem Skript ermöglicht, weiterhin andere Aufgaben auszuführen, während es auf den Abschluss einer asynchronen Aufgabe wartet. In diesem Blog untersuchen wir die Grundlagen der asynchronen Programmierung in JavaScript und wie sie durch die Verwendung von Callback-Funktionen, Versprechen und Async/Await erreicht werden kann.

Rückruffunktionen

Eine Callback-Funktion ist eine Funktion, die als Argument an eine andere Funktion übergeben und nach Abschluss der Hauptfunktion ausgeführt wird. Rückrufe werden in der asynchronen Programmierung verwendet, um auf den Abschluss einer Aufgabe zu warten, bevor der nächste Schritt ausgeführt wird.

Betrachten Sie beispielsweise den folgenden Code:

function slowTask(callback) {
  setTimeout(() => {
    console.log("Slow task completed.");
    callback();
  }, 1000);
}

function runProgram() {
  console.log("Program started.");
  slowTask(() => {
    console.log("Callback function executed.");
  });
  console.log("Program ended.");
}

runProgram();

In diesem Beispiel akzeptiert die SlowTask-Funktion einen Rückruf als Argument. Die slowTask-Funktion verwendet setTimeout, um die Ausführung einer Aufgabe um eine Sekunde zu verzögern. Die runProgram-Funktion ruft slowTask auf und übergibt eine Rückruffunktion als Argument. Die runProgram-Funktion protokolliert auch „Programm gestartet“ und „Programm beendet“. Wenn die slowTask-Funktion abgeschlossen ist, protokolliert sie „Langsame Aufgabe abgeschlossen“ und führt die Rückruffunktion aus, die „Rückruffunktion ausgeführt“ protokolliert.
Die Ausgabe wird sein:

Program started.
Program ended.
Slow task completed.
Callback function executed.

Versprechen

Promises sind ein modernerer Ansatz für die asynchrone Programmierung in JavaScript. Ein Versprechen stellt das Ergebnis eines asynchronen Vorgangs dar und kann einen von drei Zuständen haben: ausstehend, erfüllt oder abgelehnt. Ein Versprechen kann mit dem Promise-Konstruktor erstellt werden und sein Zustand kann mit den Methoden then und Catch bestimmt werden.

Zum Beispiel:

const slowTask = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("Slow task completed.");
  }, 1000);
});

function runProgram() {
  console.log("Program started.");
  slowTask
    .then((result) => {
      console.log(result);
    })
    .catch((error) => {
      console.error(error);
    });
  console.log("Program ended.");
}

runProgram();

In diesem Beispiel ist slowTask ein Promise, das nach einer Sekunde mit dem Ergebnis „Langsame Aufgabe abgeschlossen“ aufgelöst wird. Die runProgram-Funktion ruft slowTask auf und verwendet die then-Methode, um das Ergebnis zu protokollieren, wenn das Versprechen erfüllt ist.

The output will be:
Program started.
Program ended.
Slow task completed.

Asynchron/Warten

Async/await ist die neueste und am besten lesbare Möglichkeit, asynchrone Vorgänge in JavaScript zu verarbeiten. Es ermöglicht Entwicklern, asynchronen Code zu schreiben, der wie synchroner Code aussieht, was das Verständnis und die Wartung erleichtert. Das Schlüsselwort async wird verwendet, um eine asynchrone Funktion zu deklarieren, und das Schlüsselwort „await“ wird verwendet, um auf die Auflösung eines Versprechens zu warten.

Hier ist ein Beispiel, um die Verwendung von async/await in JavaScript zu demonstrieren:

async function fetchData() {
  const response = await fetch("https://api.example.com/data");
  const data = await response.json();
  console.log(data);
}

fetchData();

In diesem Beispiel wird die Funktion fetchData mit dem Schlüsselwort async als asynchron deklariert. Die Funktion verwendet „fetch“, um Daten von einer API abzurufen, und „await“ wird verwendet, um auf den Abschluss des Abrufvorgangs zu warten. Die aufgelöste Antwort wird dann mithilfe von „response.json()“ in ein JSON-Objekt umgewandelt. Das Schlüsselwort „await“ wird verwendet, um auf den Abschluss der JSON-Transformation zu warten, und das Endergebnis wird in der Konsole protokolliert.

Es ist wichtig zu beachten, dass der Code innerhalb einer asynchronen Funktion asynchron ausgeführt wird, der Code außerhalb der Funktion jedoch weiterhin synchron ausgeführt wird. Außerdem kann das Schlüsselwort „await“ nur innerhalb einer asynchronen Funktion verwendet werden.

Zusammenfassend lässt sich sagen, dass die asynchrone Programmierung in JavaScript es dem Skript ermöglicht, weiterhin andere Aufgaben auszuführen, während es auf den Abschluss einer asynchronen Aufgabe wartet. Rückruffunktionen, Versprechen und Async/Await sind drei Möglichkeiten, eine asynchrone Programmierung in JavaScript zu erreichen. Rückruffunktionen sind die einfachste und grundlegendste Möglichkeit, asynchrone Vorgänge abzuwickeln, während Versprechen einen moderneren und flexibleren Ansatz bieten. Async/await bietet die am besten lesbare Möglichkeit zur Handhabung asynchroner Vorgänge und ist die empfohlene Methode für die moderne JavaScript-Programmierung. Das Verständnis der asynchronen Programmierung in JavaScript ist wichtig für die Erstellung effizienter und reaktionsfähiger Anwendungen und eine unverzichtbare Fähigkeit für jeden JavaScript-Entwickler.

Das obige ist der detaillierte Inhalt vonAsynchrone Programmierung in Javascript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!