2010-05-28 9 views
25

Duplicar posibles:
JavaScript: var functionName = function() {} vs function functionName() {}¿Hay alguna diferencia entre var name = function() {} & function name() {} en Javascript?

Supongamos que estamos dentro de una función y no en el espacio de nombres global.

function someGlobalFunction() { 
    var utilFunction1 = function() { 
    } 

    function utilFunction2() { 
    } 

    utilFunction1(); 
    utilFunction2(); 

} 

¿Son estos también? ¿Y estas funciones dejan de existir por completo cuando devuelve someGlobalFunction? ¿Debo preferir uno u otro para la legibilidad o alguna otra razón?

Respuesta

46

Son en su mayoría lo mismo.

utilFunction1 solo estará disponible después de haber sido declarado. utilFunction2 se eleva a la parte superior de la función, por lo que se puede utilizar antes de que se defina.

function someGlobalFunction() { 
    utilFunction1(); // Error: untilFunction1 is undefined :(
    utilFunction2(); // Works 

    var utilFunction1 = function() { 
    } 

    function utilFunction2() { 
    } 
} 

A menos que se encuentran atrapados en un cierre, tanto dejará de existir cuando someGlobalFunction devoluciones.

Prefiero usar el método utilizado para declarar utilFunction2, pero depende de usted.

Declaraciones de la forma utilFunction2 (que se llaman declaraciones de funciones) tienen la ventaja de ser nombrado (es decir, aparecer como utilFunction2) en su favorito-depuradorTM, donde como utilFunction1 (llamadas expresiones de función) sería solo aparece como una función anónima .


Para completar, también tiene la forma;

var utilFunction3 = function utilFunction4() { 
    // blah 
}; 

... que se llama una expresión de función llamado , que tiene weird properties (y bugs (en versiones antiguas de IE)) de su propio.

+0

+1 - Parece que tiene todo cubierto. – ChaosPandion

+3

También se puede observar que el primero es FunctionExpression mientras que el último es FunctionDeclaration. –

9

sí, son bastante diferentes:

  • utilFunction1 no tiene nombre, por lo que si se produce una excepción, su herramienta de depuración sólo le dirá que una función anónima vomitó
  • utilFunction2 estará disponible en el alcance de la función incluso antes de que se llegue a esa línea (como se señaló fletcher)
  • utilizando la notación utilFunction2 puede causar un comportamiento extraño en determinadas circunstancias en IE.

Ex:

if (true) { 
    function utilFunction() { 
    return true; 
    } 
} else { 
    function utilFunction() { 
    return false; 
    } 
} 

utilFunction(); // returns false in IE, true everywhere else 

IE se toma el asunto ámbito de la función de los extremos, que evalúan funciones con eficacia, incluso si no hay una ruta de código para ellos!

+7

Poner una declaración de función dentro de un 'if' u otro bloque de función no es válido en ECMAScript; el comportamiento del navegador varía enormemente. ¡Evitar! – bobince

8

¡Enhorabuena!Has encontrado la situación en la que se involucra la función elevación.

var foo = function() { }; 

es bastante diferente de

function foo() { }; 

Por todas las razones indicadas en otras partes, más uno.

El segundo ejemplo se "alzará": estará disponible en cualquier lugar dentro del cierre actual (generalmente la función actual). Incluso antes de que se declare dentro de dicho cierre.

Algo como esto funcionaría:

function foo() { 
    bar(); 
    function bar() { alert('baz'); } 
} 

Mientras que algo como esto haría definitivamente no:

function foo() { 
    bar(); 
    var bar = function bar() { alert('baz'); }; 
} 

Se obtiene un error en este segundo ejemplo, porque barra no se ha definido todavía. Si intercambia las dos líneas en la función foo, ese ejemplo funcionará.

Douglas Crockford recomienda usar este segundo método, ya que no contiene un comportamiento oculto como el de izar: su código hace exactamente lo que dice que hará, sin trucos.

Cuestiones relacionadas