Maison > interface Web > js tutoriel > Explication détaillée des fermetures en Javascript

Explication détaillée des fermetures en Javascript

高洛峰
Libérer: 2017-03-12 11:22:04
original
1134 Les gens l'ont consulté

Cet article explique en détail la fermeture en Javascript

1. ?

La fermeture est un point difficile dans le langage Javascript. Elle n'est pas facile à comprendre pour les débutants, alors jetons d'abord un coup d'œil à la signification de la fermeture.

Encyclopédie Baidu et explication « officielle » : La soi-disant « fermeture » fait référence à un système qui a de nombreuses variables et les lie Une expression de l'environnement des variables (généralement une fonction), donc ces variables font également partie de cette expression.

Wikipédia : Dans les langages de programmation, les fermetures (également appelées fermetures lexicales ou fermetures de fonctions) sont utilisées dans Une technique d'implémentation de portée lexicale liaison de nom dans des langages dotés de fonctions de première classe.

Cependant, on constate que ces explications officielles ne comprennent pas clairement ce que sont les fermetures. Elles posent seulement des questions : « De quoi parlez-vous ? ».

En fait, une fermeture est simplement une fonction qui peut lire les variables locales définies par et à l'intérieur de la fonction. En Javascript, il n'y a que des sous. -fonctions à l'intérieur de la fonction. Seules les variables locales peuvent être lues, nous pouvons donc également comprendre les fermetures comme des fonctions définies à l'intérieur des fonctions.

2. Variables de fonction

Pour comprendre les fermetures, nous devons d'abord comprendre les variables de la fonction. Ces variables ont leur propre portée. Quelle est la portée ? Maintenant, de manière générale, Le nom utilisé dans un morceau de code de programme n'est pas toujours valide/disponible, et la portée du code qui limite la disponibilité du nom est la portée du nom.

Il existe deux portées de variables , l'une est globale et l'autre est locale, c'est ce que nous appelons variables globales et variable locale .  


var a=50;function fun1(){
    alert(a);
}
fun();
Copier après la connexion


Dans le code ci-dessus, a est défini en dehors de la fonction, donc dans L'appel de la variable a dans la fonction peut naturellement lire sa valeur. Nous appelons ici a une variable globale.


function fun2(){
    var a=50;
}
alert(a);
Copier après la connexion


Dans ce code, on définit a à l'intérieur de la fonction, puis quand a est appelé en dehors de la fonction, il signalera une erreur et vous dit "a n'est pas défini", on ne trouve pas a ? Avons-nous défini un ? Bien sûr, cela a été défini ! C'est juste que c'est une variable locale.

3. Comment trouver les variables "cachées" dans la fonction

Lorsque l'on tape le code du clavier, il y a toujours des raisons qui nous obligent à entrer à l'intérieur des variables locales de la fonction, nous devons alors utiliser une méthode pour extraire les variables locales "cachées" dans la fonction.

C'est-à-dire qu'à l'intérieur de la fonction, nous définissons une autre fonction.


function fun3(){
    var a=50;
    function fun4(){
        return a;
    }
    return fun4();
}
//console.log(a); 报错
console.log(fun3());
Copier après la connexion


Dans le code ci-dessus, on définit une variable a dans fun3, pour que l'on définisse une variable a en dehors de la fonction fun3 L'appel de a signalera également une erreur indiquant qu'elle est introuvable. Pour la fonction fun4 à l'intérieur de la fonction fun3, a peut être appelé, car l'externe a est en dehors de la fonction fun4. Inversement, si une variable est définie dans fun4, alors fun3 ne peut pas être appelée. de.

Un autre concept est impliqué ici, celui de la portée de la chaîne, que nous appelons la chaîne de portée. La chaîne de portée signifie que le même nom de variable générera une chaîne de portée. Lors de l'accès au nom de la variable, il saura d'abord si la portée actuelle contient la variable. Sinon, il ira à la portée parent. trouvez-la. Jusqu'à ce que la variable globale soit finalement trouvée, si la variable globale ne parvient pas à trouver la variable, une erreur sera signalée.

Ensuite, si vous souhaitez appeler une variable une fonction extérieure fun3, vous devez définir une autre fonction fun4 à l'intérieur de la fonction fun3. On la laisse renvoyer la variable a qu'elle peut appeler, puis la fonction fun4. le résultat est la variable a, puis nous renvoyons la fonction fun4, puis nous exécutons la fonction fun3, et le résultat est la valeur de la variable a.

Pour faire simple, tant que fun4 est utilisé comme valeur de retour, on peut lire ses variables internes en dehors de fun3.

4. À quoi devez-vous faire attention lorsque vous appelez des variables locales (en utilisant des fermetures) ?

1. Les fermetures entraîneront la sauvegarde des variables de la fonction en mémoire, ce qui consomme beaucoup de mémoire, donc les fermetures ne peuvent pas être abusées, sinon les performances de la page Web seront réduites.

 2. Ne modifiez pas la valeur de la variable interne de la fonction parent avec désinvolture.


Enfin, une fermeture est une fonction qui peut lire les variables internes d'autres fonctions. Elle nous permet d'appeler des variables dans la fonction parent en dehors de la fonction parent. Ce n'est en fait pas difficile à comprendre dans ces circonstances. L'important est que dans un code imprévisible, l'application spécifique de la fermeture nécessite toujours que nous la comprenions vraiment avant de pouvoir l'appliquer habilement.

 


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!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal