Heim > Web-Frontend > js-Tutorial > Hauptteil

Synchronisation und Asynchronität in JavaScript

黄舟
Freigeben: 2017-02-07 14:38:23
Original
1083 Leute haben es durchsucht

Synchronisation und Asynchronität sind beim Erlernen von JavaScript zwei sehr problematische Konzepte, insbesondere für Anfänger. Vereinfacht gesagt spricht man von Synchronisation, wenn zwei oder mehr Dinge gleichzeitig geschehen; wenn sie nicht gleichzeitig geschehen, spricht man von Asynchronität.

Obwohl diese beiden Konzepte einfach erscheinen, erfordert es viel Mühe, sie tatsächlich zu verstehen. Wir müssen durch tatsächliche Operationen verstehen, welche Situationen synchron und welche asynchron sind.

Sie denken vielleicht, dass gewöhnliche JavaScript-Funktionen synchron sind. Wenn Sie setTimeout() und AJAX verwenden, denken Sie vielleicht auch, dass sie synchron sind, oder? Wenn ich Ihnen sagen würde, dass diese beiden Funktionen zu bestimmten Zeiten auch asynchron sein können, würden Sie es glauben?

Um den Grund klar zu erklären, brauchen wir die Hilfe von Herrn X.

Szenario 1: Herr hat Aufgaben zugewiesen.

    2 Die einzige Möglichkeit, ihn zu kontaktieren, ist anzurufen.
  • 3 Egal auf welches Problem oder welche Aufgabe Sie stoßen, wenn Sie Herrn X um Hilfe bitten möchten, müssen Sie ihn anrufen.
  • 4 Herr X wird Ihnen Antworten geben oder die Aufgabe sofort erledigen und Sie nach Abschluss benachrichtigen.
  • 5 Mit der Hilfe von Mr.
  • In diesem Prozess erreichen Sie und Herr X eine synchrone Kommunikation.
  • Wenn du Fragen stellst, hört er zu; wenn er Antworten gibt, hörst du gleichzeitig zu.

Szenario 2: Herr X mag keine Synchronizität

Weil Herr . Wenn Sie ihn also anrufen, ist die Leitung immer besetzt. Du kannst ihm keine Fragen stellen und er kann sie dir nicht beantworten.

Synchronisation und Asynchronität in JavaScriptWie kann Herr X also mit dieser Situation umgehen?

1 Herr X stellt einen Assistenten Herrn M ein und ist mit einem Anrufbeantworter ausgestattet.

    2 Die Aufgabe von Herrn M. besteht darin, die Nachrichten auf dem Anrufbeantworter abzuhören, die Fragen dann zusammenzufassen und an Herrn X weiterzuleiten.
  • 3 Auf diese Weise ruft Herr X zurück, wenn Sie ihn anrufen.
  • 4 Nachdem Herr X die Fragen anderer beantwortet hat, ruft er Sie zurück und teilt Ihnen die Lösung mit.
  • Die Frage ist also, handelt es sich bei diesem Prozess um synchrone Kommunikation oder asynchrone Kommunikation?
  • Man kann sagen, dass es beides ist. Wenn Sie eine Nachricht auf dem Anrufbeantworter hinterlassen, hört Herr X nicht zu, es handelt sich also um eine asynchrone Kommunikation.

  • Aber wenn er zurückruft, kommunizieren Sie beide synchron.

Jetzt sollten Sie synchrone und asynchrone Kommunikation verstehen. Lassen Sie uns nun über Synchronisierung und Asynchronität in JavaScript sprechen.

JavaScript – eine asynchrone Programmiersprache

Wenn jemand sagt, dass JavaScript eine asynchrone Sprache ist, meint er damit im Allgemeinen, dass Sie bei der Verwendung von JavaScript Nachrichten empfangen müssen und wann Wenn Sie anrufen, hören Sie kein Besetztzeichen.

Funktionsaufrufe in JavaScript erfolgen nie direkt, sondern über Nachrichten.

JavaScript verwendet eine Nachrichtenwarteschlange, in der neu eingehende Nachrichten (oder Ereignisse) vorübergehend gespeichert werden. Die Ereignisschleife verarbeitet diese Nachrichten kontinuierlich und sendet sie an den Aufrufstapel, wo die entsprechenden Nachrichtenfunktionen zur Ausführung in Frames gestapelt werden (die unabhängigen und abhängigen Variablen der Funktion).

Der Aufrufstapel enthält den Rahmen der ersten aufgerufenen Funktion sowie die Rahmen anderer Funktionen, die durch verschachtelte Aufrufe über dieser Funktion aufgerufen werden.

Wenn eine Nachricht zur Warteschlange hinzugefügt wird, wartet sie, bis der vorherige Nachrichtenrahmen im Aufrufstapel verarbeitet wurde. Nachdem die vorherige Nachricht verarbeitet wurde, entfernt die Ereignisschleife sie aus der Warteschlange und fügt dann den entsprechenden Frame der aktuellen Nachricht zum Aufrufstapel hinzu.

Diese Nachricht beginnt erneut zu warten und weist den Aufrufstapel an, den entsprechenden Frame zu löschen und dann aus der Warteschlange entfernt zu werden.

Sehen Sie sich den folgenden Code an:

 function foo(){}function bar(){  foo();
}function baz(){  bar();
}
baz();
Nach dem Login kopieren

Die hier ausgeführte Funktion ist baz() und befindet sich in der letzten Zeile des Codesegments. Sie wird der Warteschlange hinzugefügt Nachricht. Wenn die Schleife es aufnimmt, beginnt der Aufrufstapel während der Ausführung mit dem Stapeln von Frames für baz(), bar() und foo().

Synchronisation und Asynchronität in JavaScript

Nachdem die Ausführung der Funktionen abgeschlossen ist, werden deren Frames aus dem Aufrufstapel entfernt und die Nachricht wartet weiterhin in der Warteschlange, bis baz() auf dem steht Stapel wurde ausgeworfen.

Synchronisation und Asynchronität in JavaScript


Denken Sie daran, dass Funktionsaufrufe in JavaScript nie direkt, sondern über Nachrichten erfolgen.

Was sind diese spezifischen asynchronen Methoden?

Bisher bin ich auf einige APIs gestoßen, wie zum Beispiel setTimeout() und AJAX, die speziell als asynchrone Methoden bezeichnet werden. Was ist los?

Eine sehr wichtige Sache ist zu verstehen, welche Dinge synchron und welche asynchron passieren. Mithilfe von Ereignissen und Ereignisschleifen kann JavaScript Nachrichten asynchron verarbeiten. Dies bedeutet jedoch nicht, dass alles in JavaScript asynchron ist.

Ich habe bereits gesagt, dass die Nachricht die Warteschlange erst verlässt, wenn der Aufrufstapel den entsprechenden Frame löscht. Es ist zum Beispiel so, als würden Sie nicht rausgehen, um sich einen Film anzusehen, bis Sie die Antwort bekommen – was zu diesem Zeitpunkt passiert, ist synchron: Sie stehen da und warten darauf, dass die Aufgabe erledigt wird, und gehen erst, nachdem Sie gesehen haben, dass die Aufgabe mit Ihnen erledigt ist eigene Augen.

Das Obige ist der synchrone und asynchrone Inhalt von JavaScript. Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn)!


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