Heim  >  Artikel  >  Web-Frontend  >  Detaillierte Analyse und Antworten auf die Prinzipien des JavaScript-Betriebs

Detaillierte Analyse und Antworten auf die Prinzipien des JavaScript-Betriebs

亚连
亚连Original
2018-05-18 16:59:541415Durchsuche

Dieser Artikel bietet Ihnen eine detaillierte theoretische Analyse der Funktionsweise von JavaScript und den Austausch von Wissenspunkten. Wenn Sie daran interessiert sind, lernen Sie es bitte.

JavaScript ist eine objektbasierte dynamische, schwach typisierte Skriptsprache (im Folgenden als JS bezeichnet). Sie unterscheidet sich von anderen Programmiersprachen wie Java/C++ und anderen kompilierten Sprachen. Diese Sprachen Bevor der Code ausgeführt wird, wird der gesamte Code kompiliert und zunächst in Bytecode (Maschinencode) kompiliert. Dann ausführen. JS muss nicht in Zwischencode kompiliert werden, sondern kann direkt im Browser ausgeführt werden. Der JS-Ausführungsprozess kann in zwei Phasen unterteilt werden: Kompilierung und Ausführung. (Siehe das Buch JS You Don’t Know). Wenn der JS-Controller zu einem Stück ausführbarem Code wechselt (dieser ausführbare Code wird während der Kompilierungsphase generiert), wird der entsprechende Ausführungskontext (EC für kurz). Der Ausführungskontext kann als Ausführungsumgebung verstanden werden (der Ausführungskontext kann nur vom JS-Interpreter erstellt und nur vom JS-Interpreter verwendet werden. Benutzer können das „Objekt“ nicht bedienen).

Die Ausführungsumgebung in JS ist in drei Kategorien unterteilt:

  • Globale Umgebung: Wenn die JS-Engine einen Codeblock betritt, Wenn Sie beispielsweise auf das Tag 3f1c4e4b6b16bbbd69b2ee476dc4f83axxx2cacc6d41bbb37262a98f745aa00fbf0 stoßen, gelangen Sie in eine globale Ausführungsumgebung.

  • Funktionsumgebung: Wenn eine Funktion aufgerufen wird, wird eine Funktionsausführung innerhalb der Funktionsumgebung gebildet

  • eval(): Führen Sie die Zeichenfolge allein als JS-Code aus. Es wird nicht empfohlen,

zu verwenden von JS-Code. In JS wird eine Datenstruktur wie ein Stapel verwendet, um den Ausführungskontext zu verwalten wird als Funktionsaufrufstapel bezeichnet.

Eigenschaften des Ausführungskontexts

  • Das untere Ende des Stapels ist immer der globale Ausführungskontext, und es gibt nur einen

  • Der globale Ausführungskontext wird nur dann im Stapel angezeigt, wenn der Browser geschlossen ist

  • Es gibt keine Begrenzung für die Anzahl anderer Ausführungskontexte

  • Die Oberseite des Stapels ist immer der aktuell aktive Ausführungskontext, der Rest befindet sich in einem Wartezustand. Sobald die Ausführung abgeschlossen ist, wird der Stapel sofort geöffnet und die Kontrolle wird dann an den nächsten Ausführungskontext zurückgegeben

  • Die Funktion wird nur jedes Mal aufgerufen, es wird ein Ausführungskontext dafür erstellt, der bei der Deklaration der Funktion nicht vorhanden ist.

Ausführungskontext kann anschaulich als gewöhnliches JS-Objekt verstanden werden. Der Lebenszyklus eines Ausführungskontexts besteht grob aus zwei Phasen:

Erstellungsphase

Diese Phase schließt hauptsächlich drei Ereignisse ab: 1. Variables Objekt erstellen 2. Bereichskette einrichten 3. Bestimmen Sie diesen Punkt

Ausführungsphase

Diese Phase wird hauptsächlich abgeschlossen Variablenzuweisung, Funktionsaufruf und andere Operationen

Der Erstellungsprozess von Variablenobjekten (VO)

  • 1. Erstellen und initialisieren Sie das Argumentobjekt gemäß den Funktionsparametern. und Argumente angeben Das Objekt fügt Attribute wie „0“, „1“, „2“ und „3“ hinzu, deren Anfangswert undefiniert ist, und der Wert arguments.length wird auf die tatsächliche Anzahl der übergebenen Parameter gesetzt.

  • 2. Suchen Sie die Funktionsdeklaration und fügen Sie Attribute zum Variablenobjekt hinzu. Der Attributname ist der Referenzwert der Funktion eine mit demselben Namen, überschreiben Sie sie direkt

  • 3 Suchen Sie nach einer Variablendeklaration (bei der Suche nach einer Variablen entsprechen die Parameter der Funktion der Variablendeklaration, also die Das gleiche Attribut wie der Parametername wird ebenfalls zum VO hinzugefügt, und der Anfangswert wird ebenfalls undefiniert hinzugefügt. Fügen Sie dem Variablenobjekt ein Attribut hinzu. Der Attributname ist der Variablenname und der Attributwert ist undefiniert bereits ein Bezeichner mit demselben Namen vorhanden ist, wird dieser nicht verarbeitet.

Wenn ein Bezeichner (Funktion, Variable) mit demselben Namen vorhanden ist, kann die Funktion die Variable überschreiben und die Funktion hat eine höhere Priorität als die Variable

Variablenobjekt (OV) und Aktivierungsobjekt (AO) sind dasselbe, zwei Namen zu unterschiedlichen Zeiten. Es wird während des Erstellungszeitraums als Variablenobjekt und während des Ausführungszeitraums als Aktivierungsobjekt bezeichnet. >Wenn der JS-Controller zu diesem Codeabschnitt wechselt, wird ein Ausführungskontext erstellt.

Die Struktur Der Ausführungskontext ist ungefähr wie folgt:

var g_name="tom";
var g_age=20;
function g_fn(num){
 var l_name="kity";
 var l_age=18;
 function l_fn(){
  console.log(g_name + '===' + l_name + '===' + num);
 }
}
g_fn(10);

Sobald der Ausführungskontext erstellt ist, wird er sofort in den Funktionsaufrufstapel verschoben Der Interpreter wird stillschweigend eine Sache tun, nämlich ein internes Attribut [[scope]] zur Funktion in der aktuellen VO hinzufügen. Eigenschaften verweisen auf die obige Bereichskette.


G_EC = {
 VO   : {},
 Scope_chain : [],
 this  : {}
}

/* VO的结构大概 */
VO = {
 g_name : undefined,
 g_age : undefined,
 g_fn : <函数在内存中引用值>
}

/* Scope_chain的大概结构如下 */
Scope_chain = [ G_EC.VO ] // 数组中第一个元素是当前执行上下文的VO,第二个是父执行上下文的VO,最后一个是全局执行上下文的VO,在执行阶段,会沿着这个作用域链一个一个的查找标识符,如果查到则返回,否知一直查找到全局执行上下文的VO

/* this */
this = undefined // 此时this的值是undefined

Ausführungsphase

Führen Sie den Code Zeile für Zeile aus. Wenn ein Ausdruck gefunden wird, wird er in der aktuellen Bereichskette gesucht. Wenn das VO-Objekt gefunden wird, wird es zurückgegeben. Wenn es nicht gefunden wird, wird weiter nach dem nächsten VO-Objekt gesucht, bis das globale VO-Objekt beendet wird.

In dieser Phase kann es zu Variablenzuweisungen, Funktionsaufrufen und anderen Vorgängen kommen. Wenn der Interpreter auf g_fn() trifft, weiß er, dass es sich um einen Funktionsaufruf handelt, und erstellt dann sofort einen Funktionsausführungskontext Dafür, fn_EC, hat der Kontext fn_EC auch zwei Phasen

, nämlich die Erstellungsphase und die Ausführungsphase.

In der Erstellungsphase wird für den Funktionsausführungskontext beim Erstellen des Variablenobjekts ein zusätzliches Argumentobjekt erstellt und dann werden dem Argumentobjekt Attribute hinzugefügt: „0“, „1“, „2“ deren Anfangswert undefiniert ist,

  • Funktionsdeklaration finden

  • Var-Variablendeklaration finden

Das Obige habe ich für alle zusammengestellt und hoffe, dass es in Zukunft für alle hilfreich sein wird.

Verwandte Artikel:

p5.jsImplementierung der Golden-Spiral-Animation

Ereignisdelegation in JS Detaillierte Erläuterung der Verwendung von Berechnungs- und Methoden in Vue.js

Das obige ist der detaillierte Inhalt vonDetaillierte Analyse und Antworten auf die Prinzipien des JavaScript-Betriebs. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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