Comprendre les concepts de portée JavaScript et les compétences scope_javascript au niveau du bloc

La portée est toujours la chose la plus importante dans tout langage de programmation, car elle contrôle la visibilité et le cycle de vie des variables et des paramètres. En parlant de cela, comprenez d’abord deux concepts : la portée au niveau du bloc et la portée de la fonction.

Qu'est-ce que la portée au niveau du bloc ?

Tout ensemble d'instructions entre accolades ({ et }) appartient à un bloc, et toutes les variables qui y sont définies sont invisibles en dehors du bloc de code.

La portée de la fonction est facile à comprendre (*^__^*). Les paramètres et variables définis dans la fonction ne sont pas visibles en dehors de la fonction.

La plupart des langages de type C ont une portée au niveau des blocs, mais pas JS. Veuillez consulter la démo ci-dessous :

//C语言 
#include <stdio.h> 
void main() 
{ 
int i=2; 
i--; 
if(i) 
{ 
int j=3; 
} 
printf("%d/n",j); 
} 

Lorsque vous exécutez ce code, l'erreur "utiliser une variable non définie :j" apparaîtra. Comme vous pouvez le voir, le langage C a une portée au niveau du bloc car j est défini dans le bloc d'instruction if, il est donc inaccessible en dehors du bloc.

Comment se comporte JS ? Regardons une autre démo :

functin test(){ 
for(var i=0;i<3;i++){ 
} 
alert(i); 
} 
test();

Exécutez ce code et "3" apparaît. On voit qu'en dehors du bloc, la variable que j'ai définie dans le bloc est toujours accessible. En d'autres termes, JS ne prend pas en charge la portée au niveau du bloc, il prend uniquement en charge la portée de la fonction et les variables définies n'importe où dans une fonction sont visibles n'importe où dans la fonction.

Alors, comment pouvons-nous faire en sorte que JS ait une portée au niveau du bloc ? Vous souvenez-vous encore que les variables définies dans une fonction seront détruites lorsque la fonction est appelée ? Pouvons-nous utiliser cette fonctionnalité pour simuler la portée au niveau du bloc de JS ? Jetez un œil à la DÉMO ci-dessous :

function test(){ 
(function (){ 
for(var i=0;i<4;i++){ 
} 
})(); 
alert(i); 
} 
test();

Lorsque vous l'exécutez à nouveau à ce moment-là, une erreur non définie "i" apparaîtra Haha, elle a été implémentée ~~~Ici, nous mettons le bloc d'instructions for dans une fermeture, puis appelons cette fonction When. l'appel de fonction est terminé, la variable i est automatiquement détruite, on ne peut donc pas y accéder en dehors du bloc.

La fonctionnalité de fermeture de JS est la fonctionnalité la plus importante ((*^__^*) tout le monde le sait). En JS, afin d'éviter les conflits de noms, nous devons essayer d'éviter d'utiliser des variables globales et des fonctions globales. Alors, comment l’éviter ? Oui, comme le montre la démo ci-dessus, nous pouvons mettre tout ce que nous voulons définir dans un

(function (){ 
//内容 
})();

, à l'heure actuelle, sommes-nous équivalents à ajouter une portée de fonction à leur couche externe ? Les programmes en dehors de cette portée ne peuvent pas y accéder.