¿La diferencia entre las dos funciones? ("Función x" vs "var x = función")

Question

Duplicar posibles:
JavaScript: var functionName = function() {} vs function functionName() {}

¿Cuál es la diferencia entre:

function sum(x, y) { 
    return x+y; 
} 

// and 

var sum = function (x, y) { 
    return x+y; 
} 

¿Por qué uno usa más de ¿el otro?

Answer 1

La primera es conocida como una función llamada en la segunda se conoce como una función anónima.

La diferencia práctica clave está en cuando puede usar la función de suma. Por ejemplo: -

var z = sum(2, 3); 
function sum(x, y) { 
    return x+y; 
} 

z se asigna 5, mientras que la siguiente: -

var z = sum(2, 3); 
var sum = function(x, y) { 
    return x+y; 
} 

fallará ya que al momento de la primera línea ha ejecutado la suma variables aún no se le ha asignado la función.

Las funciones con nombre se analizan y asignan a sus nombres antes de que comience la ejecución, razón por la cual una función nombrada se puede actualizar en un código que precede a su definición.

Las variables asignadas a una función por código solo pueden usarse como función una vez que la ejecución ha transcurrido después de la asignación.

Answer 2

La primera es una declaración de función nombrada, la segunda asigna una expresión de función anónima a una variable.

Se añade la sentencia de función a su alcance inmediato - no es necesario para ejecutarlo antes de poder llamarlo, por lo que este funciona:

var y = sum(1, 2); 

function sum(x, y) { 
    return x + y; 
} 

Pero la expresión función sólo se asigna a la variable cuando se ejecuta el código, por lo que este no funciona:

// Error here because the function hasn't been assigned to sum yet. 
var y = sum(1, 2); 

var sum = function(x, y) { 
    return x + y; 
} 

Una ventaja de la forma de expresión es que se puede utilizar para asignar diferentes funciones a la expresión en diferentes puntos - para que pueda cambiar la función, o use uno diferente bajo diferentes condiciones ons (como dependiendo del navegador que se use).

Una ventaja de una declaración de función con nombre, es que los depuradores podrán mostrar el nombre. Aunque, puede nombrar a las expresiones de función:

var sum = function sum(x, y) { 
    return x + y; 
} 

pero esto puede ser confuso ya que los dos nombres son en realidad en distintos ámbitos y se refieren a cosas diferentes.

Answer 3

Significan exactamente lo mismo. Es solo azúcar sintáctico. Este último es IMO más revelador de lo que JavaScript realmente está haciendo; es decir, la "suma" es sólo una variable, inicializado con un objeto función, que puede ser sustituida por otra cosa:

$ js 
js> function sum(x,y) { return x+y; } 
js> sum(1,2); 
3 
js> sum=3 
3 
js> sum(1,2); 
typein:4: TypeError: sum is not a function 
js> sum 
3 

Answer 4

La primera tiende a ser utilizado por algunas razones:

1. El nombre de "suma" aparece en la StackTrace lo que hace más fácil la depuración en muchos navegadores.
2. El nombre "suma" se puede utilizar dentro del cuerpo de la función que hace que sea más fácil de usar para funciones recursivas.
3. declaraciones de función son "elevadas" en javascript, por lo que en el primer caso, la función se garantiza que es definida exactamente una vez.

4. inserción coma provoca

   var f = function (x) { return 4; } 
   
   (f) 
   

   para asignar 4-f.

Sin embargo, hay algunas advertencias que tener en cuenta. No haga

var sum = function sum(x, y) { ... }; 

en IE 6, ya que dará lugar a dos objetos de función que se crean. Especialmente confuso si lo hace

var sum = function mySym(x, y) { ... }; 

Según la norma, función sum (x, y) {...} no puede aparecer dentro de un bloque o si un cuerpo del bucle, por lo que diferentes intérpretes tratarán

if (0) { 
    function foo() { return 1; } 
    } else { 
    function foo() { return 2; } 
    } 
    return foo(); 

diferente. En este caso, usted debe hacer

var foo; 
    if (0) { 
    foo = function() { return 1; } 
    } ... 

Answer 5

La diferencia es ...

Ésta es una función sin nombre

var sum = function (x, y) { 
    return x+y; 
} 

Así que si usted alerta (suma); que se obtiene "la función (x, y) {return x + y;}" (sin nombre) Si bien esta es una función llamada:

function sum(x, y) { 
     return x+y; 
} 

Si alerta (suma); Ahora que se obtiene "la función suma (x, y) {return x + y;}" (nombre es suma)

Tener funciones con nombre ayudan si está utilizando un perfilador porque el generador de perfiles puede decir que funcionas suma 's tiempo de ejecución ... etc en lugar de tiempo de ejecución de un desconocido funciones ... etcétera

Answer 6

aquí está otro ejemplo: función sayHello (nombre) {alert (' hola' + nombre)}

ahora, supongamos que desea modificar el evento onclick de un botón, como dice "hola mundo"

no puede escribir:

yourBtn.onclik = sayHello ('mundo'), porque debe proporcionar una referencia de función.

luego puede usar la segunda forma: yourBtn.onclick = function() {sayHello ('workld'); }

Ps: lo siento por mi mal inglés!

Answer 7

Los dos fragmentos de código que ha publicado allí, para casi todos los propósitos, se comportarán de la misma manera.

Sin embargo, la diferencia en el comportamiento es que con la segunda variante, esa función solo se puede llamar después de ese punto en el código.

Con la primera variante, la función está disponible para el código que se ejecuta arriba donde se declara la función.

Esto se debe a que con la segunda variante, la función se asigna a la variable foo en tiempo de ejecución. En el primero, la función se asigna a ese identificador foo en el tiempo de análisis.

Más información técnica

Javascript tiene tres formas de definir funciones.

1. Su primer ejemplo es una declaración de función . Utiliza la declaración "función" para crear una función. La función está disponible en el momento de análisis y se puede llamar a cualquier parte de ese alcance. Todavía puede almacenarlo en una propiedad de variable o objeto más adelante.
2. Su segundo fragmento muestra una expresión de función . Esto implica utilizar el operador de "función" para crear una función: el resultado de ese operador se puede almacenar en cualquier propiedad de variable u objeto. La expresión de la función es poderosa de esa manera. La expresión de función a menudo se denomina "función anónima" porque no tiene que tener un nombre,
3. La tercera forma de definir una función es "Function()" constructor, que no se muestra en su publicación original . No se recomienda utilizar esto ya que funciona de la misma manera que eval(), que tiene sus problemas.