Heim > Web-Frontend > js-Tutorial > Hauptteil

So verwalten Sie die Reihenfolge der Codeausführung in JS

php中世界最好的语言
Freigeben: 2018-04-16 11:10:01
Original
7957 Leute haben es durchsucht

Dieses Mal zeige ich Ihnen, wie Sie die Reihenfolge der Codeausführung in JS steuern und welche Vorsichtsmaßnahmen bezüglich der Reihenfolge der JS-Operationscodeausführung gelten. Werfen wir einen Blick darauf.

1. js--->Einzelner Thread

 Genau genommen verfügt Javascript nicht über das Konzept mehrerer Threads und alle Programme werden nacheinander von einem einzelnen Thread ausgeführt.

 1. Was ist ein Single-Thread?

Einfacher ausgedrückt: Wenn der Code ausgeführt wird und ein anderer Code ausgeführt werden möchte, muss er warten, bis die Ausführung des aktuellen Codes abgeschlossen ist. 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)
 }
Nach dem Login kopieren

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 Druckergebnis 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 tritt zuerst in den Thread ein. 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)
}
Nach dem Login kopieren

2. Funktionsumfang und Codeausführung in js

  >>>Funktionsumfang

Lassen Sie uns zunächst die folgenden Konzepte verstehen:

  1. In der JS-Sprache gibt es keinen Bereich auf Blockebene, der der C-Sprache ähnelt.

 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. Zugriffsregeln für JS-Bereichskettenvariablen:

(1) Wenn die Variable, auf die zugegriffen werden soll, im aktuellen Bereich vorhanden ist, wird die Variable im aktuellen Bereich verwendet.

      (2) Wenn die Variable, auf die zugegriffen werden soll, im aktuellen Bereich nicht vorhanden ist, wird sie im Bereich der oberen Ebene bis zum globalen Bereich durchsucht.

  >>>Ausführungsreihenfolge

  Die Ausführung des JS-Codes ist in zwei Teile unterteilt:

  1. Codeüberprüfungs- und Ladephase (Vorkompilierungsphase). In dieser Phase werden Variablen und Funktionen deklariert, den Variablen werden jedoch keine Werte zugewiesen.

  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 zur Veranschaulichung einen Code:

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

 Sehen 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.

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

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Empfohlene Lektüre:

Technische Antworten zum Aufbau einer Buchverwaltungsplattform mit vue.js

Zusammenfassung häufig verwendeter Anweisungen in vue.js

Detaillierte Erklärung zum Deaktivieren und Aktivieren von JS-Schaltflächen

Das obige ist der detaillierte Inhalt vonSo verwalten Sie die Reihenfolge der Codeausführung in JS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
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