In welcher Reihenfolge wird JS-Code ausgeführt?

Dieses Mal zeige ich Ihnen die Reihenfolge, in der JS-Code ausgeführt wird. Streng genommen hat Javascript nicht das Konzept, dass mehrere Threads ausgeführt werden Nacheinander finden Sie in diesem Artikel eine detaillierte Analyse.

1. Was ist ein einzelner Thread?

Laienhaft ausgedrückt: Wenn der Code ausgeführt wird und ein anderer Code ausgeführt werden möchte, muss er warten, bis der aktuelle Code ausgeführt wird. Nehmen wir einen Code, um es zu erklären

for(var i=1;i<=3;i++){
  setTimeout(function(){
    console.log(i); //输出：4,4,4
  },0)
}

Schauen wir uns den obigen Code an. Da die Verzögerungszeit auf 0 eingestellt ist, sollte die Schleife einmal ausgeführt und sofort ein i gedruckt werden. aber das endgültige gedruckte Ergebnis ist: 4, 4, 4. Der Grund für die oben genannten Ergebnisse liegt genau darin, dass der js-Code eine Single-Thread-Anwendung ist.

Während des Ausführungsprozesses wird zuerst die for-Schleife angetroffen, und die for-Schleife gelangt zuerst in den Thread. Wenn i = 1 ist und die Schleife setTimeOut erreicht, hat die for-Schleife die Ausführung noch nicht abgeschlossen und setTimeOut wird an einem Ort (Thread-Pool) abgelegt, um auf die Ausführung zu warten. Zu diesem Zeitpunkt wird die for-Schleife weiterhin ausgeführt. Wenn i = 2 ist, ist die Ausführung der for-Schleife noch nicht abgeschlossen. Zu diesem Zeitpunkt wird setTimeOut noch im Thread-Pool platziert und wartet auf die Ausführung Die for-Schleife wird dreimal abgeschlossen. Nach Abschluss der Ausführung befindet sich der Thread zu diesem Zeitpunkt im Leerlauf. SetTimeOut wartet auf die Ausführung im Thread-Pool und gibt i nacheinander aus. Nach Abschluss der for-Schleife wird i zu 4 , also werden drei 4er gedruckt.

2. Wenn Sie die obige Situation ändern möchten, können Sie den folgenden Code verwenden

//将var变为let
for(let i=1; i<=3; i++){
  setTimeOut(function(){
    console.log(i); //输出的结果为1，2，3
  },0);
}
//用自执行函数进行包裹
for(var i=1; i<=3; i++){
  !function(i){
    setTimeOut(function(){
      console.log(i); //输出的结果为1，2，3
    },0);
  }(i)
}

2. js Funktionsumfang und Codeausführung

　>>>Funktionsumfang

Lassen Sie uns zunächst die folgenden Konzepte verstehen:

　1. In js-Sprache gibt es keinen Blockebenenbereich ähnlich der C-Sprache.

2. Der oberste Bereich in der js-Sprache liegt im Bereich des Fensterobjekts , das als globaler Bereich bezeichnet wird. Im globalen Bereich deklarierte Variablen sind globale Variablen.

　3. Variablen innerhalb des Gültigkeitsbereichs einer js-Funktion können nur innerhalb der Funktion und nicht außerhalb der Funktion verwendet werden. Solche Variablen sind lokale Variablen.

4. JS-Funktionen können verschachtelt werden. Die Verschachtelung mehrerer Funktionen stellt die schichtweise Verschachtelung von Bereichen dar. Dies wird in JS als Bereichskette bezeichnet.

5. Regeln für den Zugriff auf Variablen der JS-Bereichskette:

(1) Wenn im aktuellen Bereich eine Variable vorhanden ist, auf die zugegriffen werden soll, verwenden Sie die Variable im aktuellen Bereich.

(2) Wenn die Variable, auf die zugegriffen werden soll, im aktuellen Bereich nicht vorhanden ist, wird sie im oberen Bereich bis zum globalen Bereich durchsucht. > Variablen und Funktionen deklarieren, Variablen jedoch keine Werte zuweisen.

2. Die Ausführungsphase des Codes In dieser Phase werden Variablen Werte zugewiesen und Funktionen deklariert.

Nachdem wir uns einige der oben genannten spezifischen Konzepte angesehen haben, nehmen wir einen Code als Beispiel:

Schauen Sie sich den Code oben an: Das erste a gibt undefiniert aus. Grund: Gemäß den Zugriffsregeln der js-Bereichskette existiert die Variable a, auf die zugegriffen werden soll, im aktuellen Bereich, sodass die Variable im aktuellen Bereich verwendet wird. Gemäß der Ausführungsreihenfolge des js-Codes wird a zu diesem Zeitpunkt nur deklariert, aber nicht zugewiesen. Der Standardwert ist undefiniert, daher wird undefiniert ausgegeben.

Das zweite a gibt 1 aus. Gerade weil a zu diesem Zeitpunkt deklariert und ihm ein Wert zugewiesen wurde, gibt a 1 aus.

var a=1; //声明了一个全局变量
function func(){
  console.log(a); //输出：undefined。打印a，而在func这个作用域中已经声明了a变量，按照js的执行顺序，此时的a并未被赋值。
  var a=1;
  console.log(a); //输出：1。
}
func();

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie die obige Einführung gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Verwandte Lektüre:

Detaillierte Einführung in die Verwendung von require.js

Verwenden von jQuery zum Deduplizieren von Array-Sortiervorgängen

So verwenden Sie die ES6-Destrukturierungszuweisungsfunktion

Das obige ist der detaillierte Inhalt vonIn welcher Reihenfolge wird JS-Code ausgeführt?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!