Cierre de JS
Qué saber antes del cierre
1. Alcance de la función
(1). La característica especial del lenguaje JS es que las variables globales se pueden leer directamente dentro de las funciones
La copia del código es la siguiente:
<script type = "text/javaScript">
var n = 100;
función parent () {
alerta (n);
}
parent (); // 100
</script>
Si en PHP
La copia del código es la siguiente:
<? Php
$ N = 100;
función parent () {
echo $ n;
}
parent (); // El error se informará n no está definido
?>
(2). Las variables locales dentro de la función no se pueden leer fuera de la función
La copia del código es la siguiente:
<script type = "text/javaScript">
función parent () {
var m = 50;
}
padre();
alerta (m); // El error m no está definido
</script>
Tenga en cuenta que al declarar variables internamente, debe agregar VAR, de lo contrario se declarará una variable global.
La copia del código es la siguiente:
función parent () {
m = 50;
}
padre();
alerta (m); // 50
// Por supuesto, esto es aún más en PHP.
La copia del código es la siguiente:
<? Php
función parent () {
Global $ M; // Global, definición y asignación debe separarse
$ M = 50;
}
padre();
Echo $ m; // 50
?>
// Si no hay global, no habrá errores de definición
A veces, si necesita obtener variables locales dentro de la función, debe usar las características del alcance de las variables JS. Por ejemplo, la definición de funciones infantiles dentro de la función, para las funciones infantiles, la función principal es su global, y la función infantil puede acceder a las variables en la función principal (para todo el código JS, es una variable local)
La copia del código es la siguiente:
<script type = "text/javaScript">
función parent () {
var m = 50;
función son () {
alerta (m);
}
Hijo de regreso;
}
var s = parent (); // Guardar el resultado a nivel mundial
s (); // 50
</script>
Todas las variables locales dentro de los padres son visibles para las funciones de sus hijos, pero las variables locales dentro de las funciones de sus hijos son invisibles para las funciones de sus padres. Esta es la estructura de alcance de la cadena exclusiva de JS. El objeto infantil buscará las variables de todos los objetos principales niveles por nivel. Todas las variables del objeto principal son visibles para los objetos infantiles, ¡de lo contrario no se mantiene verdadero! La función de hijo anterior es un cierre
Algunos estudiantes pueden hacer esto
La copia del código es la siguiente:
función parent () {
var m = 50;
función son () {
alerta (m);
}
}
padre();
son () // La función hijo no está definida
Tenga en cuenta que en JavaScript, las funciones declaradas en la función son locales y se liberan después de que se ejecuta la función.
Presta atención a la diferencia entre esto y PHP
La copia del código es la siguiente:
<? Php
función parent () {
función son () {
$ M = 50;
echo $ m;
}
}
padre();
son (); // salida 50 no informará un error
?>
Cierre
Funciones de definición internamente Funciones, puentes que conectan funciones internas y externas
Hay 2 funciones de cierres:
Primero, la función de lectura dentro de las variables mencionadas anteriormente,
El segundo es guardar los valores de estas variables en la memoria para realizar el intercambio de datos
Aquí hay algunos ejemplos de cierres
La copia del código es la siguiente:
<script type = "text/javaScript">
var cnt = (function () {
var i = 0;
Función de retorno () {
alerta (i);
i ++;
}
}) ();
cnt (); // 0
cnt (); // 1
cnt (); // 2
cnt (); // 3
</script>
Guardo el resultado de la ejecución de la función anónima (es decir, asignar la declaración de la subfunción al corte de la variable global) en la memoria
Al ejecutar Cut (), el valor se recupera directamente de la memoria. Solo se puede llamar a la función cnt (), y no es posible alertar directamente (i)
También puede transferir parámetros al cierre
La copia del código es la siguiente:
var cnt = (function (num) {
Función de retorno () {
alerta (num);
num ++;
}
}) (5);
cnt (); // 5
cnt (); // 6
cnt (); // 7
// Por supuesto, también puede pasar parámetros al llamar
var cnt = (function () {
var i = 0;
Función de retorno (num) {
num+= i;
alerta (num);
i ++;
}
}) ();
CNT (1); // 1
CNT (2); // 3
CNT (3); // 5
Para tener una mejor comprensión de los cierres, observamos el siguiente código
Por ejemplo, quiero devolver una matriz con 5 funciones en la matriz, la primera función sale 0 y la segunda aparece 1 ...
Si el código está escrito así
La copia del código es la siguiente:
function box () {
var arr = [];
para (i = 0; i <5; i ++) {
arr = function () {return i;}
}
regresar arr;
}
var a = box ();
alerta (a); // matriz que contiene cinco cuerpos de funciones
alerta (a [0] ());
alerta (a [1] ());
El cuerpo de la función emergente
function () {return i;}}
Finalmente, esto es 4, y luego ++ se convierte en 5
Para paradas de bucle
Se descubrió que todos aparecieron 5, que obviamente no cumplían con nuestros requisitos
Solución 1
Autoexecución de las funciones dentro
La copia del código es la siguiente:
function box () {
var arr = [];
para (i = 0; i <5; i ++) {
arr = (function (num) {return i;}) (i);
}
regresar arr;
}
var a = box ();
para (var i = 0; i <a.length; i ++) {
alerta (a);
}
Pero descubrimos que los elementos en la matriz devuelto son el resultado de la ejecución de la función, pero lo que queremos es que la función debe actualizarse.
Solución 2
Implementación de cierre
La copia del código es la siguiente:
function box () {
var arr = [];
para (var i = 0; i <5; i ++) {
arr = (function (num) {
Función de retorno () {return num;}
})(i);
}
regresar arr;
}
var arr = box ();
para (var i = 0; i <5; i ++) {
alerta (arr ()); // 0,1,2,3,4
}
Código clave
La copia del código es la siguiente:
arr = (function (num) {
Función de retorno () {return num;}
})(i);
Cuando yo = 0
arr [0] = (function (num) {return function () {return num;}}) (0);
1 en punto
arr [1] = (function (num) {return function () {return num;}}) (1);
¡Lo anterior son los beneficios de los cierres! Muy simple y práctico.