2012-02-24 22 views
39

Duplicar posibles:
JavaScript: var functionName = function() {} vs function functionName() {}
Declaring functions in JavaScriptJavascript Función Definición Sintaxis

que he visto 2 sintaxis diferentes para definir funciones en javascript:

function f() { 
    ... 
} 

Además como

var f = function() { 
    ... 
}; 

¿Cuál es la diferencia entre estos? Es uno de ellos obsoleto?

+0

Aquí hay una respuesta a su pregunta: http://stackoverflow.com/a/1013387/236135 y esta es la pregunta que se hizo con los términos adecuados http://stackoverflow.com/questions/1013385/what-is-the -difference-between-a-function-expression-vs-declaration-in-javascrip –

Respuesta

44

Ninguno está en desuso, y ambos funcionarán. La diferencia aquí es que una es una función nombrada (function f()) mientras que la otra es una variable igual a una función (var f = function()).

Debe tener cuidado al establecer variables iguales a funciones. Esto funcionará:

var f = function(n) { console.log(n); }; 
f(3); // logs 3 

Pero esto va a romper, ya que la variable se define después de la llamada a la misma.

f(3); // what is f? breaks. 
var f = function(n) { console.log(n); }; 

Pero las funciones normales funcionan bien.

function abc(n) { console.log(n); } 

abc(3); // logs 3 
xyz(5); // logs 5 

function xyz(n) { console.log(n); } 

Esto se debe a que el código se analiza antes de la ejecución y todas las funciones están disponibles para llamar. Pero establecer una var igual a una función es como establecer una var para cualquier otra cosa. El orden de cuándo sucede es importante.

Ahora para algunas cosas más confuso ...

También hay funciones anónimas 'autoejecutables. Van por una variedad de nombres. La forma más común de hacerlo es algo como esto:

(function() { 
    // code in here will execute right away 
    // since the() at the end executes this (function(){}) 
})(); 

También hay una mejor versión.

!function() { 
    // again, the tailing() will execute this 
}(); 

Consulte this Stack Overflow post para obtener más información sobre las funciones anónimas.

+1

También puede tener funciones nombradas autoinvocadas: '(función foo() {...}())', o funciones nombradas asignadas a una variable: 'var foo = function bar() {...};'. La diferencia real digna de mención es que una es una * declaración de función * que siempre debe nombrarse, mientras que una * expresión de función * puede ser nombrada o anónima. –

+0

@FelixKling Buen punto. Las funciones nombradas autoinvocadas '(función foo() {...}())' son interesantes ya que puede llamar a 'foo' desde dentro de sí mismo, pero no desde afuera. Incluso cuando lo escribe como '! Function foo() {...}();'. – Marshall

+1

Sí, cuando tiene una expresión de función nombrada, el nombre solo está disponible dentro de la función. Lamentablemente, IE tiene algunos problemas con las expresiones de funciones nombradas (crea dos copias de la misma función), por lo que es mejor evitarlas.Pero teóricamente funciona;) –