Javascript-Kompilierungsprozess

Javascript ist zu einer wesentlichen Fähigkeit für die Webentwicklung geworden. Es ist nicht nur auf den Browser beschränkt, sondern wird auch häufig in verschiedenen Anwendungsszenarien wie Node.js, mobilen Terminals, Desktop-Terminals und eingebetteten Geräten verwendet. Bei der Ausführung von Javascript gibt es ein sehr wichtiges Konzept, nämlich den Kompilierungsprozess. In diesem Artikel wird der Ausführungsprozess von Javascript aus der Perspektive des Kompilierungsprozesses vorgestellt.

Was ist der Kompilierungsprozess?

Der Kompilierungsprozess ist der Prozess der Konvertierung von Quellcode in ausführbaren Code. In Javascript kann der Kompilierungsprozess in zwei Phasen unterteilt werden: die Analysephase und die Ausführungsphase.

Parsing-Phase

Die Parsing-Phase ist in zwei Teile unterteilt: lexikalische Analyse und Syntaxanalyse.

lexikalische Analyse

Die Aufgabe der lexikalischen Analyse besteht darin, den Quellcode in lexikalische Einheiten (Tokens) zu zerlegen, die die kleinsten Einheiten der Sprache sind. Zu den lexikalischen Einheiten gehören Schlüsselwörter (z. B. Funktion, Variable), Bezeichner (z. B. Variablennamen und Funktionsnamen) und Operatoren (z. B. +, -, *, / usw.).

Das Folgende ist beispielsweise eine einfache Funktionsdeklaration:

function add(x, y) {
  return x + y;
}

Diese Funktionsdeklaration wird in die folgenden lexikalischen Einheiten unterteilt:

Keyword 'function'
Identifier 'add'
Punctuator '('
Identifier 'x'
Punctuator ','
Identifier 'y'
Punctuator ')'
Punctuator '{'
Keyword 'return'
Identifier 'x'
Punctuator '+'
Identifier 'y'
Punctuator ';'
Punctuator '}'

Syntaktische Analyse

Die Aufgabe der Syntaxanalyse besteht darin, lexikalische Einheiten in abstrakte Syntaxbäume (AST) umzuwandeln. Ein abstrakter Syntaxbaum ist eine Datenstruktur, die die Syntaxstruktur von Code in einer Baumstruktur darstellt. Jeder Knoten stellt ein Konstrukt in der grammatikalischen Struktur dar, und die Unterknoten stellen Unterkonstrukte des Konstrukts dar.

Für die obige Funktionsdeklaration sieht der generierte abstrakte Syntaxbaum beispielsweise folgendermaßen aus:

{
  "type": "FunctionDeclaration",
  "id": {
    "type": "Identifier",
    "name": "add"
  },
  "params": [
    {
      "type": "Identifier",
      "name": "x"
    },
    {
      "type": "Identifier",
      "name": "y"
    }
  ],
  "body": {
    "type": "BlockStatement",
    "body": [
      {
        "type": "ReturnStatement",
        "argument": {
          "type": "BinaryExpression",
          "operator": "+",
          "left": {
            "type": "Identifier",
            "name": "x"
          },
          "right": {
            "type": "Identifier",
            "name": "y"
          }
        }
      }
    ]
  }
}

Ausführungsphase

Nach der Parsing-Phase ist abgeschlossen, Javascript Das Programm tritt in die Ausführungsphase ein. Die Aufgabe der Ausführungsphase besteht darin, den abstrakten Syntaxbaum auszuführen.

Der Prozess der Ausführung eines abstrakten Syntaxbaums kann in zwei Phasen unterteilt werden: Vorkompilierung und Ausführung.

Vorkompilierung

Die Aufgabe der Vorkompilierung besteht darin, Variablen- und Funktionsdeklarationen zu verarbeiten. Bevor die Ausführungsphase beginnt, scannt die Javascript-Engine den abstrakten Syntaxbaum des Programms und erstellt entsprechende Variablen und Funktionen im aktuellen Bereich. Dieser Vorgang wird als Bereichsvorverarbeitung bezeichnet.

Zuerst werden alle Funktionsdeklarationen erweitert. Dieser Vorgang wird als Function Declarations Hoisting bezeichnet. Der Kern des Hebens von Funktionsdeklarationen besteht darin, den Funktionsnamen und den Funktionskörper an die Spitze des aktuellen Bereichs zu heben, sodass die Funktion aufgerufen werden kann, bevor die Funktion deklariert wird.

Der folgende Code:

add(1, 2);

function add(x, y) {
  return x + y;
}

entspricht:

function add(x, y) {
  return x + y;
}

add(1, 2);

Zweitens: Deklarieren Sie alle Variablen im Voraus Förderung (Variables Heben). Es ist zu beachten, dass die Variablenförderung nur die Deklaration der Variablen fördert, nicht jedoch die Zuweisungsanweisung der Variablen.

Zum Beispiel ist der folgende Code:

console.log(a);
var a = 1;

äquivalent zu:

var a;
console.log(a);
a = 1;

Ausführung

Der Ausführungsprozess wird angezeigt entsprechend der nacheinander ausgeführten Anweisung. Während der Ausführung werden Variablen zugewiesen, Funktionen aufgerufen und können durch Codeblöcke oder Funktionen begrenzt werden.

Zusammenfassung

Der Kompilierungsprozess von Javascript umfasst die Analysephase und die Ausführungsphase. Die Analysephase umfasst die lexikalische Analyse und die Syntaxanalyse, und die Ausführungsphase umfasst die Vorkompilierung und Ausführung. Vor der Ausführungsphase verarbeitet die Javascript-Engine den Bereich vor, führt das Heben von Funktionsdeklarationen und Variablen durch und führt dann den Code in der Reihenfolge aus, in der die Anweisungen erscheinen.

Das obige ist der detaillierte Inhalt vonJavascript-Kompilierungsprozess. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!