Notes d'étude Javascript - Fonctions (3) : Fermetures et références_Connaissances de base

L'une des fonctionnalités les plus importantes de Javascript est l'utilisation de fermetures. En raison de l'utilisation de fermetures, la portée actuelle peut toujours accéder à des portées externes. Étant donné que Javascript n'a pas de portée au niveau du bloc, mais uniquement une portée de fonction, l'utilisation de fermetures est étroitement liée aux fonctions.

Variables privées simulées

Copier le code Le code est le suivant :

fonction Compteur(début) {
var count = début;
Retour {
incrément : fonction() {
Compte ;
},
          obtenir : function() {
              nombre de retours ;
>
>
>
var foo = Compteur(4);
foo.increment();
foo.get(); // 5

Ici, Counter renvoie deux fermetures : les fonctions incrémentent et obtiennent. Ces deux fonctions conservent l’accès à la portée Counter, elles peuvent donc toujours accéder au nombre de variables défini dans la portée Counter.

Comment fonctionnent les variables privées

Étant donné que Javascript ne peut pas attribuer de valeurs et faire référence à des étendues, dans l'exemple ci-dessus, il n'y a aucun moyen d'accéder directement au nombre de variables privées internes de l'extérieur. La seule façon d'y accéder est de définir une fermeture.

Copier le code Le code est le suivant :

var foo = nouveau compteur(4);
foo.hack = fonction() {
Nombre = 1337 ;
};

Le code ci-dessus ne modifiera pas la valeur de la variable count dans la portée du compteur car le hack n'est pas défini dans le compteur. Le code ci-dessus créera ou écrasera uniquement le nombre de variables globales.

Fermeture dans une boucle

L'une des erreurs les plus courantes consiste à utiliser des fermetures à l'intérieur des boucles.

Copier le code Le code est le suivant :

pour (var je = 0; je < 10; je ) {
setTimeout(fonction() {
console.log(i);
}, 1000);
>

Le code ci-dessus n'affichera pas 0 à 9, mais affichera 10 fois en continu.
L'anonymat ci-dessus conservera toujours une référence à la variable i. Lorsque la fonction console.log est appelée pour démarrer la sortie, la boucle est terminée et la variable i vaut déjà 10.
Afin d'éviter l'erreur ci-dessus, nous devons créer une copie de la variable i value à chaque fois dans la boucle.

Éviter les erreurs de citation

Afin de copier la valeur de la variable dans la boucle, le meilleur moyen est d'ajouter une fonction d'exécution immédiate anonyme dans la couche externe.

Copier le code Le code est le suivant :

pour (var je = 0; je < 10; je ) {
(fonction(e) {
​​​​ setTimeout(function() {
console.log(e);
}, 1000);
})(i);
>

Cette fonction anonyme externe reçoit la variable de boucle i comme premier paramètre et copie sa valeur dans son propre paramètre e.
La fonction anonyme externe transmet le paramètre e à setTimeout, donc setTimeout a une référence au paramètre e. Et la valeur de ce paramètre e ne changera pas en raison des changements de boucle externe.

Il existe une autre façon d'obtenir le même effet, qui consiste à renvoyer une fonction anonyme dans la fonction anonyme de setTimeout :

Copier le code Le code est le suivant :

pour (var je = 0; je < 10; je ) {
setTimeout((fonction(e) {
         return function() {
console.log(e);
>
})(i), 1000)
>

De plus, cela peut également être réalisé grâce à la méthode bind.

Copier le code Le code est le suivant :

pour (var je = 0; je < 10; je ) {
setTimeout(console.log.bind(console, i), 1000);
>

En fin d’article, résumons :

(1) La fermeture est un principe de conception qui simplifie les appels de l'utilisateur en analysant le contexte, permettant à l'utilisateur d'atteindre son objectif sans le savoir
 ; (2) Les articles grand public sur l'analyse des fermetures sur Internet sont en fait contraires au principe de fermeture. Si vous avez besoin de connaître les détails de la fermeture pour bien l'utiliser, la fermeture est un échec de conception
; (3) Étudiez le moins possible.