Explication détaillée de l'utilisation de js Closure_Basic Knowledge

Jetons un coup d’œil aux utilisations des fermetures. En fait, en utilisant des fermetures, nous pouvons faire beaucoup de choses. Par exemple, il peut simuler le style de codage orienté objet ; exprimer le code de manière plus élégante et concise et améliorer l'efficacité d'exécution du code dans certains aspects ;

1 Fonction anonyme auto-exécutable

Nous connaissons toutes les variables. Si vous n'ajoutez pas le mot-clé var, elles seront ajoutées par défaut aux propriétés de l'objet global. Il y a de nombreux inconvénients à ajouter de telles variables temporaires à l'objet global,
. Par exemple : d'autres fonctions peuvent abuser de ces variables, ce qui rend l'objet global trop grand et affecte la vitesse d'accès (car la valeur de la variable doit être traversée à partir de la chaîne de prototypes).
En plus d'utiliser le mot-clé var à chaque fois qu'une variable est utilisée, nous rencontrons souvent une telle situation dans des situations réelles, c'est-à-dire que certaines fonctions ne doivent être exécutées qu'une seule fois et leurs variables internes n'ont pas besoin d'être conservées
. Par exemple, pour l'initialisation de l'interface utilisateur, nous pouvons utiliser des fermetures :

Copier le code Le code est le suivant :

var modèle de données = { 
tableau : [],
arbre : {}
}; 
​  
(fonction(dm){ 
pour(var je = 0; je < dm.table.rows; je ){
      var row = dm.table.rows[i];                            pour(var j = 0; j < row.cells; i ){
             drawCell(i, j);                                                                                                        }  
                           
//construire dm.tree
})(modèle de données);



Nous créons une fonction anonyme et l'exécutons immédiatement puisque les variables qu'elle contient ne peuvent pas être référencées de l'extérieur,

Par conséquent, il sera publié peu de temps après l'exécution. La clé est que ce mécanisme ne polluera pas l'objet global.

2 caches

Regardons un autre exemple. Imaginons que nous ayons un objet fonction dont le traitement prend beaucoup de temps,

Ensuite, nous devons stocker la valeur calculée. Lorsque vous appelez cette fonction, recherchez-la d'abord dans le cache. Si elle ne peut pas être trouvée, calculez-la,

. Mettez ensuite à jour le cache et renvoyez la valeur si elle est trouvée, renvoyez simplement la valeur trouvée directement. Les fermetures font exactement cela car elles ne libèrent pas de références externes,

Ainsi, la valeur à l'intérieur de la fonction peut être préservée.

Copier le code Le code est le suivant :

var CachedSearchBox = (function(){
var cache = {},
Compte = [];
Retour {
attachSearchBox : function(dsid){
                if (dsid in cache) {//Si le résultat est dans le cache                                                                                             Return cache [dsid]; // Retourne directement à l'objet dans le cache
                                                                                 var fsb = new uikit.webctrl.SearchBox(dsid);//New  
               cache[dsid] = fsb;//Mettre à jour le cache                                                                 If (count.length & gt; 100) {// La taille du cache cache = 100
                                                                                                                                                                                                                              supprimer le cache[count.shift()] ;                                                                                     retourner fsb;                                                              },                                                     ​  
Clearsearchbox : Fonction (dsid) {
Si(dsid dans le cache){
cache[dsid].clearSelection();
                                                                                                                                           };  
})();
​  
CachedSearchBox.attachSearchBox("input1");



De cette façon, lorsque nous appelons CachedSearchBox.attachSerachBox("input1") pour la deuxième fois,
Nous pouvons récupérer l'objet du cache sans créer un nouvel objet de champ de recherche.

3 Implémenter l'encapsulation

Vous pouvez d'abord regarder un exemple d'encapsulation. Les variables internes ne sont pas accessibles en dehors de la personne, mais sont accessibles en fournissant une fermeture :

Copier le code

Le code est le suivant :

var personne = fonction(){  //La portée de la variable est à l'intérieur de la fonction et n'est pas accessible de l'extérieur nom var = "par défaut"; nom var                             Retour {           getName : function(){                                                  retourner le nom ;                                                     },                                                               setName : function(newName){                                               name = newName ;                                                                                                                          }   }();

​  

print(person.name);//Accès direct, le résultat n'est pas défini
print(personne.getName());
person.setName("abruzzes");
print(personne.getName());



Le résultat est le suivant :

indéfini
par défaut
abruzzes

4 Une autre utilisation importante des fermetures consiste à implémenter des objets dans des langages objets traditionnels qui fournissent des mécanismes de modèles de classe,
. De cette manière, différents objets (instances de classes) ont des membres et des états indépendants et n'interfèrent pas les uns avec les autres. Bien qu'il n'y ait pas de mécanisme comme les classes en JavaScript, en utilisant des fermetures,
Nous pouvons simuler un tel mécanisme. Prenons l'exemple ci-dessus :

Copier le code

Le code est le suivant :

function Personne(){ 
nom var = "par défaut"; nom var
                           
Retour {
          getName : function(){                                                  retourner le nom ;                                                     },                                                               setName : function(newName){                                               name = newName ;                                                                                                                          }  
}; 
​  
​  
var john = Personne();
print(john.getName());
john.setName("john");
print(john.getName());
​  
var jack = Personne();
print(jack.getName());
jack.setName("jack");
print(jack.getName());



Les résultats en cours d'exécution sont les suivants :

par défaut
Jean

par défaut jack

Ce code montre que John et Jack peuvent être appelés instances de la classe Person, car les deux instances ont un accès indépendant au membre name et ne s'influencent pas mutuellement.

Ce qui précède est la fonction de fermeture js. C'est très simple et facile à comprendre. J'espère que cela sera utile à mes amis
.