Quel est l'ordre d'exécution dans une boucle JavaScript «for»?

Question

Ce poste est en quelque sorte d'une version simplifiée de ce post:

What is the exact order of execution of Javascript's for loop?

Je suis super intéressé pourquoi je continue à me confondais tout en travaillant avec des boucles. Je voudrais apprendre comment une boucle for est exécutée sous le capot.

for (let i = 0; i < 10; i++) { 
    alert(i); 
}; 

Donc si je comprends bien, cela est aussi loin que je reçois dans la compréhension de l'ordre dans lequel quelque chose comme ceci est exécuté:

1) Le moteur initialise i = 0

2) Les contrôles du moteur que i < 10

3) le moteur ressorte de la parenthèse qui tiennent la déclaration pour

4) Le moteur exécute le code dans la boucle pour cette itération

5) Le moteur apparaît de nouveau dans la parenthèse pour augmenter i,

6) Répétez l'étape 2.

Je suppose que je suis plus confus au sujet de l'étape # 3. Est-ce que le moteur sort de la boucle 'for' pour exécuter le code dans le bloc? D'après ce que je comprends, JavaScript est monothread et ne peut s'exécuter que de façon synchrone, et donc je suis un peu confus à la façon dont au milieu d'une déclaration 'for', le moteur peut conserver le statut de 'for' en mémoire lors de l'exécution du code dans le bloc .... sauf si chacune des trois conditions de la boucle 'for' sont leurs propres commandes indépendantes, qui peuvent être exécutées et terminées avant de passer aux commandes dans le bloc. Je ne suis même pas sûr si je pose cette question correctement, je suis encore relativement nouveau à la programmation, je ne sais que vanille JS à ce stade ... le mois prochain est quand je reçois dans le nœud;)

figured it out: Click for an image of my breakpoint placement

J'ai appris que l'ordre va comme ceci: 1) var i est initialisé à 0

2) var i est vérifiée truthy

3) Si cela est vrai, le code est exécuté,

4) Une fois l'exécution terminée, i est incrémenté

5) Un incrémentée, i est vérifiée pour truthy

6) Répéter les étapes 3 - 5 jusqu'à i est une falsification

7) Itération terminée.

Merci à tous. Le débogueur Chrome est beaucoup plus puissant que je ne le pensais!

Answer 1

(Désolé représentant ne suffit pas de mettre cela dans les commentaires)

je suggère d'utiliser la fonctionnalité de débogage du navigateur. Je ne suis pas sûr du navigateur que vous utilisez, mais simplement de "déboguer JS avec le navigateur X" sur google et il y a beaucoup de tutoriels là-bas.

Commencez par créer un fichier htm de boucle simple. Ensuite, ouvrez votre navigateur et initialisez le débogueur. Ensuite, ouvrez le fichier dans votre navigateur. Ouvrez la partie "Sources" et votre code sera visible. Cliquez sur la ligne avec la boucle for et configurez un point de rupture, et créez également des montres sur vos variables (comme i).

Ensuite, rechargez le fichier htm et le débogueur s'arrêtera sur le point d'arrêt. Puis "étape dans" la boucle for étape par étape. Vous serez en mesure de regarder comment le système se déplace à travers le code en regardant chaque étape, vous pouvez regarder les variables changer, et j'espère que cela vous donnera un aperçu de la façon dont il fonctionne.

Ceci est un excellent moyen de comprendre tout code complexe que vous pourriez avoir, et de déboguer facilement les erreurs.