2011-12-23 36 views
13

que he visto:¿Cómo funciona exactamente! Function() {}() work?

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

utilizado en varios lugares de ejecutar inmediatamente una función anónima. Normalmente, se utiliza en lugar de:

(function(){ //code }()) 

Alguien sabe cómo el ! en realidad hace la función de ejecutar?

+0

Vale la pena señalar que, mientras que el primero funciona, niega el valor devuelto por la función, mientras que el segundo no. – toddsundsted

+0

¿Por qué se usa esto en lugar de simplemente terminar el enunciado con un punto y coma? Todavía es solo un personaje. – js1568

Respuesta

38

¡Qué! hace

Cuando se utiliza !, la función se convierte en el único operando de la unario (lógico) NO operador .

Esto fuerza a la función a evaluarse como una expresión, lo que permite que se invoque inmediatamente en línea.


Otras alternativas

Esto se puede hacer con casi cualquier operador. He aquí algunos ejemplos ...

'invoke',function(){ /*code*/ }(); 
1+function(){ /*code*/ }(); 
void function(){ /*code*/ }(); 
~function(){ /*code*/ }(); 
+function(){ /*code*/ }(); 

Lo bueno de algunos de estos es que el significado de que el operador no está sobrecargado.


El problema con ()

Cuando se utiliza () alrededor de la función, que puede golpear algunos errores que surgir si tiene más de una en una fila sin un punto y coma separa .

(function() { 
    alert('first'); 
}()) 


(function() { 
    alert('second'); 
}()) 

// TypeError: undefined is not a function 

Esto resultará en un TypeError, porque el par de exterior () alrededor de la segunda función será interpretado como la intención de llamada una función. El primero no devuelve una función del curso, por lo que está intentando llamar al undefined.


Cómo utilizar un operador diferente hace frente (o evita) el problema

Incluso un operador como +, que está sobrecargado hasta cierto punto no causará un error.

Si haces esto ...

+function() { 
    alert('first'); 
}() 

+function() { 
    alert('second'); 
}() 

La primera + se interpreta como un unario operador +, y convierte el resultado devuelto desde la primera función, que en este caso es undefined por lo que se convierte a NaN.

El segundo + se interpretará como el operador Además, y por lo tanto se trata de añadir NaN a la devolución de resultado de la segunda función, que de nuevo aquí es undefined.

El resultado es, por supuesto, NaN, pero es inofensivo. No hay un código ilegal para lanzar un error.


Demostración de cómo los operadores interactúan con las funciones

Para probar esto, acaba de dar a cada función un valor de retorno, luego pegarla en la consola ...

+function() { 
    alert('first'); 
    return "10"; 
}() 

+function() { 
    alert('second'); 
    return 20; 
}() 

// 30 

Obtendrá los dos alert s, y luego la consola mostrará 30 porque el primer operador + convierte el Stri ng "10" al número 10, y el segundo + agregó los dos resultados juntos.

+1

Nuevo nombre de usuario !!!!! –

+0

@ AdamRackis: Sí, me derrumbé. –

+0

¡Fantástica respuesta! Tienes mi +1. – Bojangles

2

El ! es una negación lógica ordinaria.
El () ejecuta la función.

+5

Creo que OP pregunta por qué el anteponer '!' A 'function() {// code}()' (que de otro modo sería un error) hace que se ejecute la función anónima. – toddsundsted

Cuestiones relacionadas