English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Tutorial básico de JavaScript

Objeto de JavaScript

Función de JavaScript

HTML DOM de JS

BOM del navegador JS

Tutorial básico de AJAX

Manual de referencia de JavaScript

Cierre de JavaScript

Las variables JavaScript pueden pertenecer aLocalScope oGlobalScope.

Se puede usarClosuresEstablecer la variable global como local (privada).

¿Por qué necesitamos closures?

Supongamos que queremos usar una variable para contar algo y queremos que el contador esté disponible para todas las funciones.

Podemos usar una variable global y una función para aumentar el contador:

// Inicializar el contador
var counter = 0;
// Función para incrementar el contador
function increment() {
  counter++;
}
// Llamar a increment() 3vez
increment();
increment();
increment();
// Ahora el contador debería ser3
document.getElementById("output").innerHTML = `Contador: ${counter};`;
Prueba ver‹/›

La solución anterior tiene un problema: cualquier código en la página puede cambiar el contador sin llamar a increment().

Las funciones internas de JavaScript pueden resolver este problema.

Funciones anidadas de JavaScript

JavaScript admite funciones anidadas. Las funciones anidadas pueden acceder a los ámbitos superiores.

En este ejemplo, la función interna puede acceder a la variable de contador de la función externa:

function outer() {
  var counter = 0;
  function inner() {
      counter++;
  }
  return counter; 
}
Prueba ver‹/›

Las funciones anidadas pueden resolver el problema anterior, si podemos acceder a la función inner() desde el exterior.

También necesitamos encontrar un método para que counter = 0 se ejecute solo una vez, ese es el cierre que mencionaremos a continuación.

Cierre de JavaScript

El cierre es la combinación de una función y el ámbito léxico en el que se declara la función.

El cierre puede acceder a las variables del ámbito de otra función. Esto se realiza creando una función interna. Por supuesto, la función externa no puede acceder al ámbito interno.

var increment = (function() {
  var counter = 0;
  function inner() {
      return ++counter;
  }
  return inner;
})();
Prueba ver‹/›

El valor de retorno de la función de ejecución automática se asigna a la增量.

La función de ejecución automática se ejecuta solo una vez. Establece el contador en cero y devuelve la expresión de función.

El cierre es una función que puede acceder al ámbito del padre incluso después de que la función padre se haya cerrado.