Heim > Web-Frontend > js-Tutorial > Hauptteil

Lernen Sie asynchrone Funktionen und Promise-Objekte in JavaScript

王林
Freigeben: 2023-11-03 12:57:15
Original
1034 Leute haben es durchsucht

Lernen Sie asynchrone Funktionen und Promise-Objekte in JavaScript

Um asynchrone Funktionen und Promise-Objekte in JavaScript zu erlernen, sind spezifische Codebeispiele erforderlich.

Einführung:
In der JavaScript-Entwicklung ist die asynchrone Programmierung ein wesentlicher Bestandteil. Asynchrone Funktionen und Promise-Objekte sind häufig verwendete asynchrone Programmiermethoden. In diesem Artikel werden asynchrone Funktionen und Promise-Objekte in JavaScript ausführlich vorgestellt und spezifische Codebeispiele bereitgestellt.

1. Asynchrone Funktion
1.1 Was ist eine asynchrone Funktion
In JavaScript werden synchrone Funktionen nacheinander ausgeführt, und jede Funktion muss auf das Ausführungsergebnis der vorherigen Funktion warten, bevor sie mit der Ausführung fortfahren kann. Asynchrone Funktionen müssen nicht warten, bis die vorherige Funktion die Ausführung abgeschlossen hat, und können mehrere Funktionen gleichzeitig ausführen.

1.2 Merkmale asynchroner Funktionen

  • Asynchrone Funktionen blockieren nicht die Ausführung des Codes und können die Ausführungseffizienz des Codes verbessern.
  • Asynchrone Funktionen können zeitaufwändige Vorgänge wie Netzwerkanforderungen, Lesen und Schreiben von Dateien usw. verarbeiten.
  • Das Ausführungsergebnis einer asynchronen Funktion wird normalerweise über eine Rückruffunktion, einen Ereignis-Listener oder ein Versprechen zurückgegeben.

1.3 Beispiel einer asynchronen Funktion
Das Folgende ist ein Beispielcode, der eine asynchrone Funktion zur Verarbeitung von Netzwerkanforderungen verwendet:

function fetchData(url, callback) {
  setTimeout(function() {
    const data = 'Hello, World!';
    callback(data);
  }, 2000); // 模拟网络请求延迟2秒
}

console.log('Start');
fetchData('https://example.com', function(response) {
  console.log(response);
});
console.log('End');
Nach dem Login kopieren

Führen Sie den obigen Code aus. Die Ausgabe lautet wie folgt:

Start
End
Hello, World!
Nach dem Login kopieren
Nach dem Login kopieren

Sie können sehen, dass die Ausführung des Das Programm wartet nicht auf den Abschluss der Netzwerkanforderung, sondern setzt die Ausführung des nachfolgenden Codes fort. Wenn die Netzwerkanforderung abgeschlossen ist, wird das Ergebnis über die Rückruffunktion an das Programm übergeben.

2. Promise-Objekt
2.1 Was ist ein Promise-Objekt? Das Promise-Objekt ist eine neue Funktion in JavaScript, die asynchrone Vorgänge verarbeitet. Es kann das Callback-Höllenproblem lösen und den Code lesbarer und wartbarer machen.

2.2 Eigenschaften von Promise-Objekten

    Promise-Objekte können den endgültigen Abschluss oder Misserfolg asynchroner Vorgänge darstellen und Endergebnisse oder Fehlermeldungen zurückgeben.
  • Promise-Objekte haben drei Zustände: ausstehend (in Bearbeitung), erfüllt (abgeschlossen) und abgelehnt (fehlgeschlagen).
  • Das Promise-Objekt kann eine Rückruffunktion für eine erfolgreiche Verarbeitung über die Methode then() und eine Rückruffunktion für eine fehlgeschlagene Verarbeitung über die Methode Catch() hinzufügen.
2.3 Beispiel eines Promise-Objekts

Das Folgende ist ein Beispielcode, der ein Promise-Objekt verwendet, um Netzwerkanforderungen zu verarbeiten:

function fetchData(url) {
  return new Promise((resolve, reject) => {
    setTimeout(function() {
      const data = 'Hello, World!';
      resolve(data);
    }, 2000); // 模拟网络请求延迟2秒
  });
}

console.log('Start');
fetchData('https://example.com')
  .then(response => {
    console.log(response);
  })
  .catch(error => {
    console.error(error);
  });
console.log('End');
Nach dem Login kopieren

Führen Sie den obigen Code aus. Die Ausgabe lautet wie folgt:

Start
End
Hello, World!
Nach dem Login kopieren
Nach dem Login kopieren
Sie können sehen, dass die Ausführung des Das Programm wartet nicht auf den Abschluss des Promise-Objekts, sondern setzt die Ausführung des nachfolgenden Codes fort. Wenn das Promise-Objekt abgeschlossen ist, wird die entsprechende Rückruffunktion entsprechend seinem Status ausgeführt.

Fazit:

Das Erlernen asynchroner Funktionen und Promise-Objekte in JavaScript ist der Schlüssel zur Beherrschung der asynchronen JavaScript-Programmierung. Durch asynchrone Funktionen und Promise-Objekte können zeitaufwändige Vorgänge besser gehandhabt, die Effizienz der Codeausführung verbessert und der Code lesbarer und wartbarer gemacht werden. Ich hoffe, dass die Einführung und der Beispielcode dieses Artikels den Lesern helfen können, asynchrone Funktionen und Promise-Objekte besser zu verstehen und anzuwenden.

Das obige ist der detaillierte Inhalt vonLernen Sie asynchrone Funktionen und Promise-Objekte in JavaScript. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
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