¿Cuál es la diferencia entre estas dos llamadas a función de JavaScript?¿Por qué se usan los paréntesis para envolver una llamada a función de JavaScript?
(function(){alert("foo")})()
frente a esto:
(function(){alert("foo")}())
Esto se hace para facilitar la lectura.
no hay una diferencia funcional real entre los dos ejemplos que has dado, pero ambos están muy cerca de una sencilla declaración de la función, que es diferente. Los paréntesis se agregan para la legibilidad, a fin de distinguirlos.
Esto es lo que cada uno de sus fragmentos hacer:
En el primero de los dos fragmentos, el primer paréntesis se evaluará como el valor de la función de cerrado. Entonces este valor se llamará como una función. Entonces, en última instancia, se ejecutará la función, que es probablemente lo que más te importa.
En su segundo fragmento, se evaluará que el paréntesis externo contiene una función que se declara en línea y se ejecuta inmediatamente. De nuevo, la función se ejecutará, que probablemente sea lo que más te importa.
Ambos ejecutarán la misma función, por lo que no habrá ninguna diferencia significativa.
La diferencia entre un fragmento como la suya y una sencilla declaración de la función:
Las funciones que le has dado también son idénticos a los siguientes. Acabo de agregar un nombre de función y le asigné el valor de retorno para la precisión sintáctica, que puede ignorar por el momento.
// javascript...
var val =
function myFooFunc() {
alert("foo");
}();
Sin embargo, esto podría confundirse fácilmente con un simple declaración de la función, que es diferente:
// javascript...
function myFooFunc() {
alert("foo");
}
en cuenta que la única diferencia real aquí es que esta última declaración de la función no se ejecuta inmediatamente. Los otros son Entonces, ese es un comportamiento muy diferente (la declaración simple se puede ejecutar más adelante si se llama por nombre, o puede que nunca se ejecute en absoluto). Sin embargo, a menudo es difícil ver la diferencia en la sintaxis, especialmente si el cuerpo de la función crece para ser muy largo y requiere desplazamiento en la pantalla.
¿Por qué se ejecutan las funciones inmediatamente?
Cuando una función se ejecuta inmediatamente después de que se declara, el valor a menudo se devuelve a algo (puede ser parte de una declaración de asignación). A veces, la función se está ejecutando de inmediato porque contiene funciones internas y se está utilizando para proporcionar un alcance funcional a las declaraciones cerradas.
Esencialmente, las personas envuelven paréntesis alrededor del formulario "ejecutado inmediatamente" (sus dos fragmentos y el primero de mis dos) para dar una indicación visual a otros desarrolladores de que la función se está llamando inmediatamente. Es más fácil de leer, ya que es posible que no capte los paréntesis hasta que llegue al final de la función (o los note en absoluto).
Recibo un error de sintaxis en su primer fragmento. Pero cuando pongo la variable delante de la primera función de fragmento, funciona bien. –
@Dejan - eso se debe a que el primer ejemplo ** es ** un error de sintaxis. Una declaración de función no puede ser seguida por un operador de agrupamiento. La palabra clave "(" antes de la * función * lo cambia a una expresión de función, y por supuesto necesita un cierre correspondiente ")" al final. Una vez cambiado a una expresión de función, el nombre se vuelve opcional. – RobG
Sí, quité el paréntesis externo en mi primer fragmento para llamar más la atención sobre la diferencia entre este y el segundo. Sin embargo, dado su comentario, creo que, en última instancia, puede ser más una distracción si el ejemplo no se ejecuta como un fragmento independiente. Para remediar esto, hice una pequeña edición del primer fragmento, que con suerte no distrae demasiado del punto, pero permite que el primer fragmento sea completamente válido. – keparo
Ambos tienen comportamientos similares.
Los paréntesis que encapsulan la declaración de la función indican al motor de JavaScript que ejecute el código inmediatamente después de que se haya analizado. En el primer ejemplo, está creando un objeto de función y luego lo invoca con los paréntesis que siguen. En el segundo ejemplo, le está diciendo al motor de JavaScript que cree el objeto de función e invocarlo inmediatamente.
Ejemplo:
// creates a function object
var f1 = (function() { alert('foo'); });
// creates a function object and executes it immediately
var f2 = (function() { alert('foo'); }());
La diferencia es que la F1 le da un objeto función. f2 crea e invoca una función anónima.
El operador de agrupación no es necesario en ninguno de los dos ejemplos, se usa para la legibilidad. La diferencia es que el primero asigna la función a la variable, el segundo asigna el resultado de llamar a la función. – RobG
Creo que ambos darán el mismo significado, en otras palabras, ambos son lo mismo. –
La diferencia es menor y principalmente de estilo. Algunos prefieren tener la lista de parámetros formales (también conocido como "operador de llamadas") dentro del operador de agrupamiento (como Douglas Crockford), otros prefieren el exterior. No hay diferencia práctica: prueba [Expresión de la función invocada de inmediato de Ben Alman] (http://benalman.com/news/2010/11/immediately-invoked-function-expression/). – RobG