Heim Web-Frontend js-Tutorial Was sind die asynchronen Programmiermethoden in Javascript?

Was sind die asynchronen Programmiermethoden in Javascript?

Apr 19, 2019 pm 01:07 PM
javascript 异步编程

Zu den JavaScript-Methoden zur Implementierung der asynchronen Programmierung gehören: Callback-Methoden, die leicht zu verstehen und zu implementieren, aber schwierig zu wartender Code sind, Publish/Subscribe-Methoden, Event-Listening-Methoden, die leicht zu verstehen sind und mehrere Ereignisse binden können, aber einen verwirrenden Workflow haben, und Promises-Methoden

Der asynchrone Modus ist sehr wichtig. Lang laufende Vorgänge auf der Browserseite sollten asynchron ausgeführt werden, um eine Nichtreaktion zu vermeiden. Als nächstes werde ich die Implementierung asynchroner Programmiermethoden in JavaScript im Artikel ausführlich vorstellen, was einen gewissen Referenzeffekt hat und ich hoffe, dass er für alle hilfreich ist.

Was sind die asynchronen Programmiermethoden in Javascript?

[Empfohlene Kurse: JavaScript-Tutorial]

Jeder weiß, dass die Ausführungsumgebung von JavaScript Single-Threading ist, was bedeutet, dass jeweils nur eine Aufgabe ausgeführt werden kann. Wenn Sie auf mehrere Aufgaben stoßen, müssen Sie in der Warteschlange auf den Abschluss der vorherigen Aufgabe warten. Daher dauert es sehr lange. Der synchrone Modus ähnelt diesem Single-Thread-Modus. Der asynchrone Modus ist völlig anders. Wenn eine Aufgabe abgeschlossen ist, führt sie die Rückruffunktion aus Aufgaben können gleichzeitig ausgeführt werden. Die Ausführungsreihenfolge der Aufgaben unterscheidet sich von der Reihenfolge der Aufgaben in der Warteschlange.

Methode 1: Rückrufmethode

Diese Methode ist die grundlegende Methode der asynchronen Programmierung. Angenommen, es gibt zwei Funktionen f1 und f2. Letztere wartet auf die erste Funktion Ergebnis.

F1(); 
F2();
Nach dem Login kopieren

Wenn f1 ein lang andauernder Vorgang ist, können Sie f1 überschreiben und f2 als Rückruffunktion von f1 verwenden.

function f1(callback){
setTimeout(function () {
 callback();
    }, 1000);
}
Nach dem Login kopieren

Mit diesem Modus können synchrone Vorgänge in asynchrone Vorgänge umgewandelt werden. f1 verhindert nicht die Programmausführung, sondern führt zuerst die Hauptlogik aus und führt dann zeitaufwändige Vorgänge aus.

Die Rückruffunktion Der Vorteil besteht darin, dass es leicht zu verstehen und zu implementieren ist. Der Nachteil besteht jedoch darin, dass der Code nicht lesbar und wartbar ist, verschiedene Komponenten stark gekoppelt sind, der Workflow sehr verwirrend ist und jede Aufgabe nur eine Rückruffunktion haben kann.

Methode 2: Veröffentlichen/Abonnieren

Angenommen, es gibt ein Signalzentrum, wenn eine Aufgabe abgeschlossen ist, wird sie veröffentlicht Signal an die Signalzentrale senden und andere Aufgaben können bestimmte Signale von abonnierten Signalzentralen empfangen. Dieser Ansatz wird als Publish/Subscribe-Muster oder Beobachtermuster bezeichnet.

Beispiel: f2 abonniert das Abschlusssignal

jQuery.subscribe(“done”,f2);
Nach dem Login kopieren

von der Signalzentrale und schreibt f1 dann als

function f1(){
    setTimeout(function () {
     jQuery.publish("done");
    }, 1000);
}
Nach dem Login kopieren

jQuery.publish(“done”), um anzugeben, dass es sendet, wenn f1 die Ausführung abschließt Wenn das Signal in der Signalmitte abgeschlossen ist, beginnt f2 mit der Ausführung.

Wenn f2 die Ausführung abschließt, kann es sich abmelden.

jQuery.unsubscribe(“done”,f2);
Nach dem Login kopieren

Methode Drei: Event Listening

Eine weitere Methode ist das ereignisgesteuerte Modell. Die Ausführung einer Aufgabe hängt nicht von der Codesequenz ab Ereignis stattfinden soll. Verwenden Sie in diesem Beispiel weiterhin f1 und f2 und binden Sie zunächst ein Ereignis an f1.

f1.on('done',f2);
Nach dem Login kopieren

Die Bedeutung des obigen Codes besteht darin, dass f2 ausgeführt wird, wenn das Abschlussereignis f1 eintritt.

function f1(){
    setTimeout(function () {
      f1.trigger('done');
    }, 1000);
}
Nach dem Login kopieren

f1.trigger('done') bedeutet, dass das erledigte Ereignis ausgelöst und dann f2 ausgeführt wird, wenn die Ausführung abgeschlossen ist.

Der Vorteil besteht darin, dass es leicht zu verstehen ist und mehrere Ereignisse binden kann, jedes Ereignis viele Rückruffunktionen haben kann und entkoppelt werden kann, was der Modularität zugute kommt. Der Nachteil besteht darin, dass das gesamte Programm ereignisgesteuert ist und der Arbeitsablauf nicht sehr klar ist.

Methode 4: Promises-Methode

Das Promises-Objekt ist ein von CommonJS vorgeschlagener Standard zur Bereitstellung einer gemeinsamen Schnittstelle für asynchrone Programmierung. Jede asynchrone Aufgabe gibt ein Promises-Objekt zurück, das über eine then-Methode verfügt, die das Festlegen einer Rückruffunktion ermöglicht. Beispielsweise sollte die Rückruffunktion f2 von f1:

F1().then(F2)
Nach dem Login kopieren

f1 wie folgt geschrieben werden:

function f1(){
    var dfd = $.Deferred();
    setTimeout(function () {
        dfd.resolve();
    }, 500);
    return dfd.promise;
}
Nach dem Login kopieren

Der Vorteil besteht darin, dass die Rückruffunktionen verknüpft sind und der Workflow von Das Programm ist sehr übersichtlich. Es verfügt über eine Reihe vollständiger Verknüpfungsmethoden, mit denen leistungsstarke Funktionen implementiert werden können.

Zum Beispiel das Einrichten mehrerer Rückruffunktionen:

f1().then(f2).then(f3);
Nach dem Login kopieren

Und ein weiteres Beispiel, wenn ein Fehler auftritt:

f1().then(f2).fail(f3);
Nach dem Login kopieren

Ein Vorteil, den die anderen drei Methoden nicht haben, ist Wenn Sie eine Aufgabe abgeschlossen haben und weitere Rückruffunktionen hinzufügen, werden diese sofort ausgeführt. Der Nachteil ist, dass es nicht leicht zu verstehen ist.

Zusammenfassung: Das Obige ist der gesamte Inhalt dieses Artikels, ich hoffe, er wird für alle hilfreich sein.

Das obige ist der detaillierte Inhalt vonWas sind die asynchronen Programmiermethoden in Javascript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

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

Heiße KI -Werkzeuge

Undresser.AI Undress

Undresser.AI Undress

KI-gestützte App zum Erstellen realistischer Aktfotos

AI Clothes Remover

AI Clothes Remover

Online-KI-Tool zum Entfernen von Kleidung aus Fotos.

Undress AI Tool

Undress AI Tool

Ausziehbilder kostenlos

Clothoff.io

Clothoff.io

KI-Kleiderentferner

Video Face Swap

Video Face Swap

Tauschen Sie Gesichter in jedem Video mühelos mit unserem völlig kostenlosen KI-Gesichtstausch-Tool aus!

Heiße Werkzeuge

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Wie implementiert man asynchrone Programmierung mit C++-Funktionen? Wie implementiert man asynchrone Programmierung mit C++-Funktionen? Apr 27, 2024 pm 09:09 PM

Zusammenfassung: Asynchrone Programmierung in C++ ermöglicht Multitasking, ohne auf zeitaufwändige Vorgänge warten zu müssen. Verwenden Sie Funktionszeiger, um Zeiger auf Funktionen zu erstellen. Die Rückruffunktion wird aufgerufen, wenn der asynchrone Vorgang abgeschlossen ist. Bibliotheken wie boost::asio bieten asynchrone Programmierunterstützung. Der Praxisfall zeigt, wie man mit Funktionszeigern und boost::asio asynchrone Netzwerkanfragen umsetzt.

Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Einfaches JavaScript-Tutorial: So erhalten Sie den HTTP-Statuscode Jan 05, 2024 pm 06:08 PM

JavaScript-Tutorial: So erhalten Sie HTTP-Statuscode. Es sind spezifische Codebeispiele erforderlich. Vorwort: Bei der Webentwicklung ist häufig die Dateninteraktion mit dem Server erforderlich. Bei der Kommunikation mit dem Server müssen wir häufig den zurückgegebenen HTTP-Statuscode abrufen, um festzustellen, ob der Vorgang erfolgreich ist, und die entsprechende Verarbeitung basierend auf verschiedenen Statuscodes durchführen. In diesem Artikel erfahren Sie, wie Sie mit JavaScript HTTP-Statuscodes abrufen und einige praktische Codebeispiele bereitstellen. Verwenden von XMLHttpRequest

Häufige Probleme und Lösungen bei der asynchronen Programmierung im Java-Framework Häufige Probleme und Lösungen bei der asynchronen Programmierung im Java-Framework Jun 04, 2024 pm 05:09 PM

3 häufige Probleme und Lösungen bei der asynchronen Programmierung in Java-Frameworks: Callback Hell: Verwenden Sie Promise oder CompletableFuture, um Callbacks intuitiver zu verwalten. Ressourcenkonflikt: Verwenden Sie Synchronisierungsprimitive (z. B. Sperren), um gemeinsam genutzte Ressourcen zu schützen, und erwägen Sie die Verwendung threadsicherer Sammlungen (z. B. ConcurrentHashMap). Nicht behandelte Ausnahmen: Behandeln Sie Ausnahmen in Aufgaben explizit und verwenden Sie ein Ausnahmebehandlungs-Framework (z. B. CompletableFuture.exclusionally()), um Ausnahmen zu behandeln.

Wie geht das Golang-Framework mit Parallelität und asynchroner Programmierung um? Wie geht das Golang-Framework mit Parallelität und asynchroner Programmierung um? Jun 02, 2024 pm 07:49 PM

Das Go-Framework nutzt die Parallelitäts- und Asynchronitätsfunktionen von Go, um einen Mechanismus zur effizienten Abwicklung gleichzeitiger und asynchroner Aufgaben bereitzustellen: 1. Parallelität wird durch Goroutine erreicht, sodass mehrere Aufgaben gleichzeitig ausgeführt werden können. 2. Asynchrone Programmierung wird über Kanäle implementiert kann ausgeführt werden, ohne den Hauptthread zu blockieren. Geeignet für praktische Szenarien wie die gleichzeitige Verarbeitung von HTTP-Anfragen, die asynchrone Erfassung von Datenbankdaten usw.

So erhalten Sie auf einfache Weise HTTP-Statuscode in JavaScript So erhalten Sie auf einfache Weise HTTP-Statuscode in JavaScript Jan 05, 2024 pm 01:37 PM

Einführung in die Methode zum Abrufen des HTTP-Statuscodes in JavaScript: Bei der Front-End-Entwicklung müssen wir uns häufig mit der Interaktion mit der Back-End-Schnittstelle befassen, und der HTTP-Statuscode ist ein sehr wichtiger Teil davon. Das Verstehen und Abrufen von HTTP-Statuscodes hilft uns, die von der Schnittstelle zurückgegebenen Daten besser zu verarbeiten. In diesem Artikel wird erläutert, wie Sie mithilfe von JavaScript HTTP-Statuscodes erhalten, und es werden spezifische Codebeispiele bereitgestellt. 1. Was ist ein HTTP-Statuscode? HTTP-Statuscode bedeutet, dass der Dienst den Dienst anfordert, wenn er eine Anfrage an den Server initiiert

Asynchrone Python-Programmierung: Eine Möglichkeit, effiziente Parallelität in asynchronem Code zu erreichen Asynchrone Python-Programmierung: Eine Möglichkeit, effiziente Parallelität in asynchronem Code zu erreichen Feb 26, 2024 am 10:00 AM

1. Warum asynchrone Programmierung verwenden? Bei der herkömmlichen Programmierung werden I/O-Vorgänge blockiert. Das bedeutet, dass das Programm auf den Abschluss eines Vorgangs wartet, bevor es fortfährt. Dies kann für eine einzelne Aufgabe gut funktionieren, kann jedoch dazu führen, dass das Programm bei der Verarbeitung einer großen Anzahl von Aufgaben langsamer wird. Die asynchrone Programmierung durchbricht die Einschränkungen herkömmlicher blockierender E/A und verwendet nicht blockierende E/A. Dies bedeutet, dass das Programm Aufgaben zur Ausführung auf verschiedene Threads oder Ereignisschleifen verteilen kann, ohne auf den Abschluss der Aufgabe warten zu müssen. Dadurch kann das Programm mehrere Aufgaben gleichzeitig bearbeiten und so die Leistung und Effizienz des Programms verbessern. 2. Die Grundlage der asynchronen Python-Programmierung Die Grundlage der asynchronen Python-Programmierung sind Coroutinen und Ereignisschleifen. Coroutinen sind Funktionen, die es einer Funktion ermöglichen, zwischen Anhalten und Wiederaufnehmen zu wechseln. Die Ereignisschleife ist für die Planung verantwortlich

Was sind die Vor- und Nachteile der asynchronen Programmierung in PHP? Was sind die Vor- und Nachteile der asynchronen Programmierung in PHP? May 06, 2024 pm 10:00 PM

Zu den Vorteilen der asynchronen Programmierung in PHP gehören ein höherer Durchsatz, eine geringere Latenz, eine bessere Ressourcennutzung und Skalierbarkeit. Zu den Nachteilen gehören Komplexität, Schwierigkeiten beim Debuggen und eingeschränkte Bibliotheksunterstützung. Im konkreten Fall wird ReactPHP zur Abwicklung von WebSocket-Verbindungen verwendet und demonstriert so die praktische Anwendung der asynchronen Programmierung.

Die Vorteile und Herausforderungen der asynchronen Programmierung in Golang: alles, was Sie wissen müssen! Die Vorteile und Herausforderungen der asynchronen Programmierung in Golang: alles, was Sie wissen müssen! Apr 03, 2024 pm 03:06 PM

Vorteile: Leistungsverbesserung: parallele Aufgabenausführung unter voller Nutzung von Multi-Core-Prozessoren. Skalierbarkeit: Einfache Skalierung zur Bewältigung größerer Arbeitslasten. Reaktionsfähigkeit: Der Hauptthread blockiert nicht, sodass die Anwendung weiterhin reaktionsfähig bleibt. Ressourcenoptimierung: Vermeiden Sie die Notwendigkeit von Sperr- und Synchronisierungsstrukturen. Herausforderung: Codekomplexität: Verwaltung mehrerer unabhängiger Aufgaben. Schwierigkeiten beim Debuggen: Aufgaben werden in verschiedenen Threads oder Coroutinen ausgeführt. Fehlerbehandlung: Die Fehlerbehandlung in einer gleichzeitigen Umgebung ist komplex und erfordert zusätzliche Maßnahmen. Praktischer Fall: Dateien parallel herunterladen, Goroutine zum gleichzeitigen Herunterladen mehrerer Dateien verwenden und zeigen, wie asynchrone Programmierung die Leistung verbessern kann.

See all articles