Pourquoi l'utilisation de « let » et « var » dans les boucles For JavaScript produit-elle des résultats différents ?

Explication de la portée let et Block dans les boucles For

En JavaScript, le mot-clé let empêche les déclarations de variables en double et permet d'utiliser des variables dans fermetures. Cependant, son comportement avec les boucles for peut prêter à confusion.

Problème :

Dans le code suivant :

// prints '10' 10 times
for (var i = 0; i < 10; i++) { process.nextTick(_ => console.log(i)) }
// prints '0' through '9'
for (let i = 0; i < 10; i++) { process.nextTick(_ => console.log(i)) }

Pourquoi l'utilisation de let in la deuxième boucle donne un résultat différent sortie ?

Solution :

L'utilisation des boucles let in for crée une nouvelle portée de bloc pour chaque itération. Cela signifie qu'une nouvelle variable i est créée à chaque itération et qu'elle n'est pas partagée entre les itérations. Dans la première boucle, qui utilise var, la même variable i est réutilisée à chaque itération, conduisant à la sortie de « 10 » à plusieurs reprises.

Mécanismes internes :

La spécification ECMAScript définit le comportement des boucles let in for comme suit :

• Pour chaque expression d'initialisation (par exemple, soit i = 0), un nouvel environnement lexical est créé avec une liaison pour le nom initialisé.
• Pour chaque expression itérative suivante (par exemple, i ), un nouvel environnement lexical est créé avec une copie de les liaisons de l'environnement précédent.

Dans le deuxième exemple, le nouvel environnement lexical créé pour chaque itération garantit qu'une nouvelle variable i est utilisée dans chaque itération, ce qui entraîne la sortie de « 0 » à « 9 ».

Conclusion :

L'utilisation de let in for boucles crée une portée de bloc au sein de chaque itération, ce qui peut être utile pour éviter les conflits et maintenir l’encapsulation. Ce comportement n'est pas seulement du sucre syntaxique mais une fonctionnalité fondamentale de let en JavaScript.

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!