Clôture JS
Que savoir avant la fermeture
1. Portée de la fonction
(1). La caractéristique spéciale du langage JS est que les variables globales peuvent être lues directement à l'intérieur des fonctions
La copie de code est la suivante:
<script type = "text / javascript">
var n = 100;
fonction parent () {
alerte (n);
}
parent (); // 100
</cript>
Si en php
La copie de code est la suivante:
<? Php
$ n = 100;
fonction parent () {
Echo $ n;
}
parent (); // l'erreur sera signalée n n'est pas définie
?>
(2). Les variables locales à l'intérieur de la fonction ne peuvent pas être lues en dehors de la fonction
La copie de code est la suivante:
<script type = "text / javascript">
fonction parent () {
var m = 50;
}
mère();
alerte (m); // l'erreur m n'est pas définie
</cript>
Notez que lors de la déclaration des variables en interne, vous devez ajouter VAR, sinon une variable globale sera déclarée.
La copie de code est la suivante:
fonction parent () {
M = 50;
}
mère();
alerte (m); // 50
// Bien sûr, c'est encore plus en PHP.
La copie de code est la suivante:
<? Php
fonction parent () {
Global $ m; // global, la définition et la cession doivent être séparées
$ m = 50;
}
mère();
Echo $ m; // 50
?>
// S'il n'y a pas de global, il n'y aura pas d'erreurs de définition
Parfois, si vous devez obtenir des variables locales à l'intérieur de la fonction, vous devez utiliser les caractéristiques de la portée des variables JS. Par exemple, définissant les fonctions enfants à l'intérieur de la fonction, pour les fonctions enfants, la fonction parent est son global et la fonction enfant peut accéder aux variables de la fonction parent (pour l'ensemble du code JS, c'est une variable locale)
La copie de code est la suivante:
<script type = "text / javascript">
fonction parent () {
var m = 50;
fonction fils () {
alerte (m);
}
Retour fils;
}
var s = parent (); // Enregistrer le résultat à l'échelle mondiale
s (); // 50
</cript>
Toutes les variables locales au sein du parent sont visibles par leur enfant, mais les variables locales au sein de leurs fonctions enfants sont invisibles pour leurs fonctions parentales. Il s'agit de la structure de portée de la chaîne unique à JS. L'objet enfant consultera toutes les variables des objets parents de niveau par niveau. Toutes les variables de l'objet parent sont visibles pour les objets enfants, sinon il ne tient pas vrai! La fonction de fils ci-dessus est une fermeture
Certains étudiants peuvent le faire
La copie de code est la suivante:
fonction parent () {
var m = 50;
fonction fils () {
alerte (m);
}
}
mère();
Son () // La fonction Son n'est pas définie
Notez que dans JavaScript, les fonctions déclarées dans la fonction sont locales et elles sont libérées après l'exécution de la fonction.
Faites attention à la différence entre cela et PHP
La copie de code est la suivante:
<? Php
fonction parent () {
fonction fils () {
$ m = 50;
Echo $ m;
}
}
mère();
Son (); // la sortie 50 ne signalera pas une erreur
?>
Fermeture
Fonctions définir en interne les fonctions, ponts reliant les fonctions internes et externes
Il y a 2 fonctions de fermetures:
Tout d'abord, la fonction de lecture à l'intérieur des variables susmentionnées,
La seconde consiste à enregistrer les valeurs de ces variables en mémoire pour réaliser le partage de données
Voici quelques exemples de fermetures
La copie de code est la suivante:
<script type = "text / javascript">
var cnt = (function () {
var i = 0;
return function () {
alerte (i);
i ++;
}
}) ();
cnt (); // 0
cnt (); // 1
cnt (); // 2
cnt (); // 3
</cript>
J'enregistre le résultat d'exécution de la fonction anonyme (c'est-à-dire en attribuant la déclaration de la sous-fonction à la coupe de variable globale) en mémoire
Lors de l'exécution de Cut (), la valeur est directement récupérée de la mémoire. Seule la fonction CNT () peut être appelée, et il n'est pas possible d'alerter directement (i)
Vous pouvez également transférer des paramètres à la fermeture
La copie de code est la suivante:
var cnt = (fonction (num) {
return function () {
alerte (num);
num ++;
}
}) (5);
cnt (); // 5
cnt (); // 6
cnt (); // 7
// Bien sûr, vous pouvez également transmettre des paramètres lorsque vous appelez
var cnt = (function () {
var i = 0;
return function (num) {
num + = i;
alerte (num);
i ++;
}
}) ();
CNT (1); // 1
cnt (2); // 3
cnt (3); // 5
Afin d'avoir une meilleure compréhension des fermetures, nous examinons le code suivant
Par exemple, je souhaite retourner un tableau avec 5 fonctions dans le tableau, la première fonction apparaît 0, et le second apparaît 1 ...
Si le code est écrit comme ça
La copie de code est la suivante:
Box de fonction () {
var arr = [];
pour (i = 0; i <5; i ++) {
arr = function () {return i;}
}
retour arr;
}
var a = box ();
Alerte (a); // tableau contenant cinq corps de fonction
alerte (a [0] ());
alerte (a [1] ());
Le corps de la fonction pop-up
function () {return i;}}
Enfin, ce i est 4, puis ++ devient 5
Pour les arrêts de boucle
Il a été constaté que tous ont éclaté 5, ce qui ne répondait évidemment pas à nos exigences
Solution 1
Auto-exécution des fonctions à l'intérieur
La copie de code est la suivante:
Box de fonction () {
var arr = [];
pour (i = 0; i <5; i ++) {
arr = (fonction (num) {return i;}) (i);
}
retour arr;
}
var a = box ();
pour (var i = 0; i <a.length; i ++) {
alerte (a);
}
Mais nous avons constaté que les éléments du tableau retourné sont le résultat de l'exécution de la fonction, mais ce que nous voulons, c'est que la fonction doit être mise à niveau.
Solution 2
Mise en œuvre de la fermeture
La copie de code est la suivante:
Box de fonction () {
var arr = [];
pour (var i = 0; i <5; i ++) {
arr = (fonction (num) {
return function () {return num;}
})(je);
}
retour arr;
}
var arr = box ();
pour (var i = 0; i <5; i ++) {
alerte (arr ()); // 0,1,2,3,4
}
Code clé
La copie de code est la suivante:
arr = (fonction (num) {
return function () {return num;}
})(je);
Quand i = 0
arr [0] = (fonction (num) {return function () {return num;}}) (0);
1 heures
arr [1] = (fonction (num) {return function () {return num;}}) (1);
Ce qui précède est les avantages des fermetures! Très simple et pratique.