tipos - retornar valor de una funcion javascript

¿Ubicación de paréntesis para funciones de JavaScript anónimas de ejecución automática?

Question

Hace poco estuve comparando la versión actual de json2.js con la versión que tenía en mi proyecto y noté una diferencia en cómo se creó y ejecutó la expresión de la función.

El código utilizado para envolver una función anónima entre paréntesis y luego ejecutarla

(function () {
// code here
})();

pero ahora ajusta la función auto ejecutada entre paréntesis.

(function () {
// code here
}());

Hay un comentario de CMS en la respuesta aceptada de Explique la sintaxis de función anónima encapsulada de JavaScript que "both: (function(){})(); y (function(){}()); son validos."

Me preguntaba cuál es la diferencia? ¿El primero ocupa la memoria dejando una función global anónima? ¿Dónde debe ubicarse el paréntesis?

Answer 1

¡La diferencia simplemente existe porque a Douglas Crockford no le gusta el primer estilo para IIFEs ! (seriamente) Como puedes ver en este video !! .

La única razón para la existencia del envoltorio adicional () {en ambos estilos} es ayudar a hacer que la sección de código Expresión de función , porque la declaración de función no se puede invocar inmediatamente. Algunos scripts / minify-ers solo usan + ! , - y ~ lugar de paréntesis también. Me gusta esto:

+function() {
var foo = ''bar'';
}();
!function() {
var foo = ''bar'';
}();
-function() {
var foo = ''bar'';
}();
~function() {
var foo = ''bar'';
}();

Y todos estos son exactamente iguales a tus alternativas. Elegir entre estos casos es completamente independiente y no hace diferencia. {Los que tienen () producen 1 byte de archivo más grande ;-)}

Answer 2

En ese caso, no importa. Está invocando una expresión que se resuelve en una función en la primera definición, y define e invoca inmediatamente una función en el segundo ejemplo. Son similares porque la expresión de la función en el primer ejemplo es solo la definición de la función.

Hay otros casos más obviamente útiles para invocar expresiones que se resuelven en funciones:

(foo || bar)()

Answer 3

No hay ninguna diferencia más allá de la sintaxis.

En cuanto a sus preocupaciones sobre el segundo método de hacerlo:

Considerar:

(function namedfunc () { ... }())

namedfunc aún no estará en el alcance global aunque hayas proporcionado el nombre. Lo mismo ocurre con las funciones anónimas. La única forma de obtenerlo en ese ámbito sería asignarlo a una variable dentro de los parens.

((namedfunc = function namedfunc () { ... })())

Los parens externos son innecesarios:

(namedfunc = function namedfunc () { ... })()

Pero no querías esa declaración global de todos modos, ¿verdad?

Entonces se reduce a:

(function namedfunc () { ... })()

Y puede reducirlo aún más: el nombre es innecesario ya que nunca se usará (a menos que su función sea recursiva ... e incluso entonces podría usar arguments.callee )

(function () { ... })()

Así es como lo pienso (puede ser incorrecto, todavía no he leído la especificación ECMAScript). Espero eso ayude.

Answer 4

Son prácticamente lo mismo.

La primera envuelve paréntesis alrededor de una función para que sea una expresión válida y la invoque. El resultado de la expresión no está definido.

El segundo ejecuta la función y los paréntesis alrededor de la invocación automática lo convierten en una expresión válida. También evalúa como indefinido.

No creo que haya una forma "correcta" de hacerlo, ya que el resultado de la expresión es el mismo.

> function(){}()
SyntaxError: Unexpected token (
> (function(){})()
undefined
> (function(){return ''foo''})()
"foo"
> (function(){ return ''foo''}())
"foo"