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

javascript html

Question

Posible duplicado:
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é se usa uno sobre el otro?

Answer 1

El primero es una declaración de función nombrada, el segundo asigna una expresión de función anónima a una variable.

La instrucción de función se agrega a su alcance de inmediato; no es necesario que la ejecute antes de poder llamarla, por lo que esto funciona:

var y = sum(1, 2);

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

Pero la expresión de la función solo se asigna a la variable cuando se ejecuta el código, por lo que esto 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 puede usarla para asignar diferentes funciones a la expresión en diferentes puntos, por lo que puede cambiar la función o usar una diferente bajo diferentes condiciones (como dependiendo del navegador que se utilice).

Una ventaja de una declaración de función nombrada es que los depuradores podrán mostrar el nombre. Aunque, puedes nombrar expresiones de funciones:

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

Pero esto puede ser confuso ya que los dos nombres están en diferentes ámbitos y se refieren a cosas diferentes.

Answer 2

El primero se conoce como función nombrada, y el segundo se conoce como función anónima.

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

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

z tiene asignado 5 mientras que esto: -

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

Fallará ya que en el momento en que se ejecutó la primera línea, la suma variable todavía no se le ha asignado la función.

Las funciones con nombre se analizan y se 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 3

Ellos 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, "suma" es solo una variable, inicializada con un objeto de función, que luego puede ser reemplazada 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 diferencia es...

Esta es una función sin nombre

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

Entonces, si alerta (suma); obtienes "función (x, y) {return x + y;}" (sin nombre) Si bien esta es una función nombrada:

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

Si alerta (suma); ahora obtienes "function sum (x, y) {return x + y;}" (name is sum)

Tener funciones nombradas ayuda si está usando un generador de perfiles porque el generador de perfiles puede indicarle el tiempo de ejecución de la suma de la función ... etcétera en lugar de un tiempo de ejecución de funciones desconocidas ... etcétera

Answer 5

he aquí otro ejemplo: function sayHello (name) {alert (''hello'' + name)}

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

no puedes escribir:

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

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

PD: perdón por mi mal inglés!

Answer 6

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

Sin embargo, la diferencia en el comportamiento es que con la segunda variante, esa función solo puede invocarse 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 . Esto usa la declaración de "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 el uso del operador "función" para crear una función: el resultado de ese operador se puede almacenar en cualquier variable u propiedad del objeto. La expresión de la función es poderosa de esa manera. La expresión de función a menudo se llama una "función anónima" porque no tiene que tener un nombre,
3. La tercera forma de definir una función es el constructor "Function ()" , 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.

Answer 7

El primero tiende a usarse por algunas razones:

1. El nombre "suma" aparece en el stacktrace que facilita la depuración en muchos navegadores.
2. El nombre "suma" se puede utilizar dentro del cuerpo de la función, lo que facilita su uso para funciones recursivas.
3. las declaraciones de funciones se "alzan" en javascript, por lo que en el primer caso, se garantiza que la función se definirá exactamente una vez.

4. Causas de inserción de semiconductor

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

   para asignar 4 a f .

Sin embargo, hay algunas advertencias a tener en cuenta. No hagas

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

en IE 6 ya que resultará en la creación de dos objetos de función. Especialmente confuso si lo haces

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

De acuerdo con el estándar, la función suma (x, y) {...} no puede aparecer dentro de un bloque if o un cuerpo de bucle, por lo que diferentes intérpretes tratarán

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

diferentemente. En este caso, deberías hacer

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