Quel est l’ordre dans lequel le code JS est exécuté ?

Cette fois, je vais vous montrer l'ordre dans lequel le code JS est exécuté. À proprement parler, javascript n'a pas le concept de plusieurs threads. séquentiellement. Cet article vous donnera une analyse détaillée.

1. Qu'est-ce qu'un seul fil ?

En termes simples, lorsque le code est en cours d'exécution, si un autre morceau de code veut être exécuté, il doit attendre que le code actuel soit exécuté. Prenons un morceau de code pour l'expliquer

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

Jetons un coup d'œil au code ci-dessus Puisque le temps de retard est fixé à 0, la boucle doit être exécutée une fois et un i doit être imprimé immédiatement, mais le résultat final imprimé est : 4, 4, 4. La raison pour laquelle les résultats ci-dessus se produisent est précisément parce que le code js est une application monothread.

Pendant le processus d'exécution, la boucle for est rencontrée en premier et la boucle for entre en premier dans le thread. Lorsque i=1, une fois que la boucle atteint setTimeOut, la boucle for n'a pas encore terminé son exécution et setTimeOut sera placé dans un endroit (pool de threads) pour attendre l'exécution. A ce moment, la boucle for continue de s'exécuter. Lorsque i=2, l'exécution de la boucle for n'est pas encore terminée. À ce moment, setTimeOut sera toujours placé dans le pool de threads en attente d'exécution... et ainsi de suite, jusqu'à ce que la boucle for continue de s'exécuter. La boucle for se termine 3 fois, la boucle for une fois l'exécution terminée, le thread est inactif à ce moment-là. Le setTimeOut en attente d'exécution dans le pool de threads s'exécute et imprime i en séquence, une fois l'exécution de la boucle for terminée, i devient 4. , donc trois 4 sont imprimés.

2. Si vous souhaitez modifier la situation ci-dessus, vous pouvez utiliser le code suivant

//将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 Portée de la fonction et exécution du code

　>>>Portée de la fonction

Commençons par comprendre les concepts suivants :

　1. Dans js, il n'y a pas de portée au niveau du bloc similaire au langage c.

2. La portée de niveau supérieur dans le langage js se trouve dans la portée de l'objet fenêtre , qui est appelée portée globale. Les variables déclarées dans la portée globale sont des variables globales.

　3. Les variables dans la portée d'une fonction js ne peuvent être utilisées qu'à l'intérieur de la fonction et ne peuvent pas être utilisées en dehors de la fonction.

4. Les fonctions JS peuvent être imbriquées. L'imbrication de plusieurs fonctions constitue l'imbrication couche par couche des portées. C'est ce qu'on appelle la chaîne de portée en JS.

5. Règles d'accès aux variables de la chaîne de portée JS :

(1) Lorsqu'il y a une variable accessible dans la portée actuelle, utilisez la variable dans la portée actuelle.

(2) Lorsque la variable à laquelle accéder n'existe pas dans la portée actuelle, elle sera recherchée dans la portée supérieure jusqu'à la portée globale. > Déclarez les variables et les fonctions, mais n'attribuez pas de valeurs aux variables. La valeur par défaut des variables n'est pas définie.

2. La phase d'exécution du code Dans cette phase, les variables se voient attribuer des valeurs et les fonctions sont déclarées.

Après avoir examiné certains des concepts spécifiques ci-dessus, prenons un morceau de code comme exemple :

Regardez le code ci-dessus : le premier a génère un résultat non défini. Raison : selon les règles d'accès de la chaîne de portée js, la variable a à laquelle accéder existe dans la portée actuelle, donc la variable dans la portée actuelle est utilisée. Selon l'ordre d'exécution du code js, a à ce moment-là est uniquement déclaré mais non attribué. La valeur par défaut est indéfinie, donc indéfini est affiché.

Le deuxième a produit 1. C'est précisément parce que a a été déclaré et attribué une valeur à ce moment-là, donc a produit 1.

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

Je pense que vous maîtrisez la méthode après avoir lu l'introduction ci-dessus. Pour des informations plus intéressantes, veuillez prêter attention aux autres articles connexes sur le site Web chinois de php !

Lecture connexe :

Introduction détaillée à l'utilisation de require.js

Utilisation de jQuery pour dédupliquer les tableaux Opérations de tri

Comment utiliser la fonction d'affectation de déstructuration ES6

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!