Heim > Web-Frontend > js-Tutorial > Hauptteil

Erfahren Sie mehr über die Prinzipien der JavaScript-Kompilierung

WBOY
Freigeben: 2022-07-15 15:02:10
nach vorne
1826 Leute haben es durchsucht

Dieser Artikel bringt Ihnen relevantes Wissen über Javascript, das hauptsächlich die damit verbundenen Probleme organisiert. Javascript ist eine vom Prototyp geerbte objektorientierte Dynamik, die aus der LiveScript-Sprache von Netscape entwickelt wurde. Schauen wir uns das an , ich hoffe, es wird für alle hilfreich sein.

Erfahren Sie mehr über die Prinzipien der JavaScript-Kompilierung

[Verwandte Empfehlungen: Javascript-Video-Tutorial, Web-Frontend]

1. Wortsegmentierung/lexikalische Analyse

Lassen Sie uns zunächst darüber sprechen, was Wortsegmentierung ist eine Zeichenfolge in sinnvolle Codeblöcke in einer Programmiersprache. Diese Codeblöcke werden Token genannt. Beispielsweise wird der Code var a = 2 in die folgenden lexikalischen Einheiten zerlegt. Konkret: var,a,=,2. var a = 2这段代码,会被分解为下面的词法单元。具体为:var,a,=,2。
注意:分词其实就是将上面的整段代码进行一个拆分为一段一段。

2.解析/语法分析

解析就是将词法单元流转换为一个有元素逐级嵌套所组成的代表了程序语法结构的树。这个树被称为:抽象语法树。鉴于这里过长的标准词,就不做考虑了,本人直接以一种更加直观的形式展示。具体如下图:
Erfahren Sie mehr über die Prinzipien der JavaScript-Kompilierung
解析:抽象语法树会有一个var的顶级节点,之后会有一个变量为a的子节点以及赋值符=的一个节点。在赋值符下又有一个为2的子节点。具体就对应了var a = 2这段代码。

3.代码生成

将抽象语法树转换为可执行代码的过程被称为代码生成。这个过程与语言,目标平台息息相关。简单来说就是有某种方法可以将var a = 2Hinweis: Bei der Wortsegmentierung wird der gesamte obige Code tatsächlich in Abschnitte aufgeteilt.

2. Parsing/grammatische Analyse

Beim Parsen wird der lexikalische Einheitenstrom in einen Baum umgewandelt, der aus Elementen besteht, die Ebene für Ebene verschachtelt sind und die Programmsyntaxstruktur darstellen. Dieser Baum heißt: abstrakter Syntaxbaum. Da die Standardwörter hier zu lang sind, werden wir sie nicht direkt in einer intuitiveren Form darstellen. Das spezifische Bild lautet wie folgt:
Bildbeschreibung hier einfügen

Analyse: Der abstrakte Syntaxbaum verfügt über einen Knoten der obersten Ebene für var, gefolgt von einem untergeordneten Knoten mit der Variablen a und einem Knoten mit dem Zuweisungsoperator =. Unter dem Zuweisungssymbol befindet sich ein weiterer untergeordneter Knoten von 2. Konkret entspricht es dem Code var a = 2.

3. Codegenerierung

Der Prozess der Umwandlung eines abstrakten Syntaxbaums in ausführbaren Code wird als Codegenerierung bezeichnet. Dieser Prozess hängt eng mit der Sprache und der Zielplattform zusammen. Einfach ausgedrückt gibt es eine Möglichkeit, den abstrakten Syntaxbaum von var a = 2 in Maschinenanweisungen umzuwandeln. Wird verwendet, um eine Variable namens a zu erstellen und einen Wert in a zu speichern.

4.LHS- und RHS-Abfragen

Die Ausführung von JavaScript-Code hängt hauptsächlich von der Engine ab. Wenn die Engine var a = 2 ausführt, ermittelt sie, ob die Variable a deklariert wurde, indem sie danach sucht. Der Suchvorgang wird durch Bereiche unterstützt. Während des Abfragevorgangs führt die Engine eine LHS-Abfrage (Linksabfrage) für die Variable a und eine Rechtsabfrage für den Wert durch. Einfach ausgedrückt: Wenn die Variable auf der linken Seite der Zuweisungsoperation erscheint, wird eine LHS-Abfrage durchgeführt, und wenn sie auf der rechten Seite erscheint, wird eine RHS-Abfrage durchgeführt. Genauer gesagt versucht die LHS-Abfrage, den Container der Variablen selbst zu finden, während die RHS-Abfrage versucht, ihren Quellwert abzurufen.

Hinweis: In der Funktion gibt es sowohl LHS- als auch RHS-Abfragen. Denn beim Übergeben von Parametern führt der Code eine implizite Zuweisung durch.

5. Ausnahme

Wenn die Variable nicht deklariert wurde, ist das Verhalten der LHS-Abfrage und der RHS-Abfrage unterschiedlich.

function foo(a){
    console.log(a+b);
    b=a;}foo(2)
Nach dem Login kopieren
Hinweis: Die erste rechte Abfrage auf b kann die Variable nicht finden, was bedeutet, dass es sich um eine nicht deklarierte Variable handelt, da sie in keinem relevanten Bereich gefunden werden kann. Wenn RHS die erforderlichen Variablen im verschachtelten Bereich nicht finden kann, löst die Engine eine Ausnahme aus. 6. Quiz🎜
function foo(a){
  var b=a;
  return a+b;
 }
 var c=foo(2)
Nach dem Login kopieren
🎜Frage: Finden Sie alle LHS-Anfragen und RHS🎜 Antwort: LHS(c=…,a=2,b=…) und RHS(foo(2…,=a,a…, …b) )🎜🎜[Verwandte Empfehlungen: 🎜Javascript-Video-Tutorial🎜, 🎜Web-Frontend🎜]🎜

Das obige ist der detaillierte Inhalt vonErfahren Sie mehr über die Prinzipien der JavaScript-Kompilierung. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:csdn.net
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
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!