Heim Web-Frontend js-Tutorial Detaillierte Erläuterung der JavaScript-Multithreading_Javascript-Fähigkeiten

Detaillierte Erläuterung der JavaScript-Multithreading_Javascript-Fähigkeiten

May 16, 2016 pm 03:45 PM

Obwohl immer mehr Websites mit AJAX-Technologie entwickelt werden, ist die Erstellung einer komplexen AJAX-Anwendung immer noch ein Problem.

Was sind die Hauptgründe für diese Schwierigkeiten? Handelt es sich um ein asynchrones Kommunikationsproblem mit dem Server? Oder handelt es sich um ein GUI-Programmierproblem? Normalerweise werden diese beiden Aufgaben von Desktop-Programmen erledigt. Warum ist es dann so schwierig, eine AJAX-Anwendung zu entwickeln, die dieselbe Funktion erreichen kann?

Jeder weiß, dass JavaScript in einem einzelnen Thread ausgeführt wird, aber es kann eine Methode auch regelmäßig über setTimeout oder setInterval ausführen. Über Ajax können Sie die Hauptlogik weiterhin ausführen, nachdem Sie eine Anfrage an den Server gesendet, aber keine Antwort erhalten haben . Wie dies geschieht, wird im Folgenden erläutert.

Schauen Sie sich zunächst den folgenden Code an:

<html>
  <body>
  <script type="text/javascript">
    function printHello()
    {
      console.time("hello");
    }
    function printHello1()
    {
      console.timeEnd("hello");
    }
    setTimeout(printHello,1000);
    setTimeout(printHello1,5000);
    function wait(time)
    {
      var now = Date.now();
      while(Date.now() - now < time)
      {
      }
    }
    wait(5000);
  </script>
  </body>
</html>
Nach dem Login kopieren

Das Ausführungsergebnis des obigen Codes ist

hello: 0.124ms
Nach dem Login kopieren

Wie aus dem Code ersichtlich ist, werden printHello und printHello1 fast gleichzeitig ausgeführt. Für ein Multithread-Modell sollte das Ausführungsintervall 4000 ms betragen.

Der Grund dafür ist, dass setTimeout das Ereignis nur zu diesem Zeitpunkt in die Warteschlange schiebt, anstatt es sofort auszuführen. Der konkrete Zeitpunkt der Ausführung hängt von der Inaktivität des Browsers ab.

Tatsächlich sind Browser zwar Single-Threaded, aber ein typischer Browser verfügt über die folgenden Threads:

Javascript-Engine-Thread
Schnittstellen-Rendering-Thread
Browser-Ereignis-Trigger-Thread
HTTP-Anfragethread

Javascript-Einzelthread bezieht sich darauf, dass der JavaScript-Engine-Thread seine Ereigniswarteschlange in einem einzelnen Thread verarbeitet. Viele Ereignisse sind asynchron, z. B. Mausklickereignisse, setTimeout und Ajax-Rückrufereignisse auftreten, stellt der Browser diese Ereignisse in die Ausführungswarteschlange und wartet darauf, dass sie ausgeführt werden, wenn der Browser inaktiv ist.

Außerdem ist es erwähnenswert, dass der Ajax-Aufruf tatsächlich asynchron ist. Der Browser startet einen neuen Thread, um eine Anfrage an den Server zu senden in der Serverrückgabewarteschlange.

Das Obige ist mein Verständnis von JavaScript-Multithreading. Ich hoffe auch, dass alle Helden wertvolle Meinungen abgeben und gemeinsam lernen können. Ich hoffe, dass die obige Einführung für alle hilfreich sein wird.

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 Artikel -Tags

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)

Ersetzen Sie Stringzeichen in JavaScript Ersetzen Sie Stringzeichen in JavaScript Mar 11, 2025 am 12:07 AM

Ersetzen Sie Stringzeichen in JavaScript

Benutzerdefinierte Google -Search -API -Setup -Tutorial Benutzerdefinierte Google -Search -API -Setup -Tutorial Mar 04, 2025 am 01:06 AM

Benutzerdefinierte Google -Search -API -Setup -Tutorial

Beispielfarben JSON -Datei Beispielfarben JSON -Datei Mar 03, 2025 am 12:35 AM

Beispielfarben JSON -Datei

Erstellen Sie Ihre eigenen AJAX -Webanwendungen Erstellen Sie Ihre eigenen AJAX -Webanwendungen Mar 09, 2025 am 12:11 AM

Erstellen Sie Ihre eigenen AJAX -Webanwendungen

8 atemberaubende JQuery -Seiten -Layout -Plugins 8 atemberaubende JQuery -Seiten -Layout -Plugins Mar 06, 2025 am 12:48 AM

8 atemberaubende JQuery -Seiten -Layout -Plugins

Was ist ' this ' in JavaScript? Was ist ' this ' in JavaScript? Mar 04, 2025 am 01:15 AM

Was ist ' this ' in JavaScript?

Verbessern Sie Ihr JQuery -Wissen mit dem Quell Betrachter Verbessern Sie Ihr JQuery -Wissen mit dem Quell Betrachter Mar 05, 2025 am 12:54 AM

Verbessern Sie Ihr JQuery -Wissen mit dem Quell Betrachter

10 Mobile Cheat Sheets für die mobile Entwicklung 10 Mobile Cheat Sheets für die mobile Entwicklung Mar 05, 2025 am 12:43 AM

10 Mobile Cheat Sheets für die mobile Entwicklung

See all articles