¿Qué es la construcción (function() { } )() en JavaScript?
Me gustaría saber qué significa esto:
(function () {
})();
¿Esto básicamente dice document.onload?
Es una expresión de función invocada inmediatamente , o IIFE para abreviar. Se ejecuta inmediatamente después de su creación.
No tiene nada que ver con ningún controlador de eventos para ningún evento (como document.onload).
Considere la parte dentro del primer par de paréntesis: ....es una expresión de función regular. Luego mire el último par , normalmente se agrega a una expresión para llamar a una función; en este caso, nuestra expresión anterior.(function(){})();(function(){})();
Este patrón se usa a menudo cuando se intenta evitar la contaminación del espacio de nombres global, porque todas las variables utilizadas dentro del IIFE (como en cualquier otra función normal ) no son visibles fuera de su alcance.
Es por eso que, tal vez, confundiste esta construcción con un controlador de eventos para window.onload, porque a menudo se usa así:
(function(){
// all your code here
var foo = function() {};
window.onload = foo;
// ...
})();
// foo is unreachable here (it’s undefined)
Corrección sugerida por Guffa :
La función se ejecuta inmediatamente después de su creación, no después de su análisis. Todo el bloque de script se analiza antes de ejecutar cualquier código que contenga. Además, analizar el código no significa automáticamente que se ejecute; si, por ejemplo, el IIFE está dentro de una función, no se ejecutará hasta que se llame a la función.
Actualización Dado que este es un tema bastante popular, vale la pena mencionar que los IIFE también se pueden escribir con la función de flecha de ES6 (como Gajus señaló en un comentario ):
((foo) => {
// do something with foo here foo
})('foo value')
Es solo una función anónima que se ejecuta inmediatamente después de su creación.
Es como si lo asignaras a una variable y lo usaras inmediatamente después, solo que sin la variable:
var f = function () {
};
f();
En jQuery hay una construcción similar en la que quizás estés pensando:
$(function(){
});
Esa es la forma corta de vincular el readyevento:
$(document).ready(function(){
});
Pero las dos construcciones anteriores no son IIFE .
