2011-11-29 7 views
14

estoy depuración de código JavaScript de otra persona y la mayoría del código está envuelto de esta manera:

(function ($) { 
    //majority of code here... 
})(jQuery); 

Lo que está pasando con el ($) y la (jQuery)? No me enseñaron a codificar así y no los he visto. ¿Cuál es su propósito?

Además, no hay document.ready, pero supongo que es porque el código se ejecuta justo después de que es leído por el (); al final?

+0

Ese código se ejecutará en document.ready – longbkit

+5

@longbkit: No, eso no es código DOM listo. – RightSaidFred

+4

@longbkit, no, eso no es lo que significa. Por favor, ve y lee sobre el cierre ... o, demonios, comienza a aprender javascript. –

Respuesta

16
var $ = "some value we don't care about"; 

// v=====normal plain old function 
(function ($) { 
//  ^=======receives jQuery object as the $ parameter 

    //majority of code here, where $ === jQuery... 

    $('.myclass').do().crazy().things(); 


})(jQuery); 
// ^=======immediately invoked, and passed the jQuery object 


// out here, $ is undisturbed 
alert($); // "some value we don't care about" 
+3

Bien, básicamente, el objetivo de hacer esto es llamar a jQuery con la notación $() dentro de esa función, y fuera de esa función, si algo más como el prototipo usa la notación $(), ¿no importa? Así que realmente te ahorra tener que escribir jQuery() (o alguna otra notación) cada vez que usas sin conflicto ... tiene sentido – tsdexter

+2

Esencialmente todo, eso está en el bit 'mayoría de código aquí ...', está aislado del resto del código. Existe en un ámbito separado. Si crea 'var something = 1' allí, no termina en el ámbito global de' ventana'. El código fuera de esta estructura no puede sobrescribir nada que esté dentro. –

+1

@tsdexter: Sí, lo tienes. El 'jQuery' global es referenciado por el' $ 'local, lo que significa que el' $ 'global (si lo hay) se puede usar para otros fines.En JavaScript, el alcance variable se crea con una función. – RightSaidFred

13

Esto es útil cuando se desea/necesidad de utilizar jQuery.noConflict(), y el nombre global $ no es un alias para jQuery. El código que publicó le permite usar el $ más corto para significar jQuery dentro de la función anónima solamente, sin $ que necesite ser global.

+0

Gracias, aunque RightSaidFred te ganó. Muy apreciado. – tsdexter

+0

+1 por mencionar 'jQuery.noConflict' que hace que jQuery abandone el' $ 'global. – RightSaidFred

0

Esta estructura se llama Plugin JQuery, el propósito de los complementos es crear un marco de cualquier tarea/función común en su proyecto, del mismo modo puede extender sus complementos según su uso en página diferente o en la misma página. de esa manera puedes evitar repetir el mismo código en todas partes.

comprobar que funciona http://docs.jquery.com/Plugins/Authoring

+0

Esa estructura no es una mera construcción jQuery. Y aunque se puede usar al crear un complemento, no es necesario. Los plugins jQuery se crean extendiendo 'jQuery.prototype'. – RightSaidFred

3

Sólo para ampliar sobre RightSaidFred's respuesta un poco, cuando vi por primera vez la sintaxis ()() que estaba un poco confundido, pero tenía sentido una vez que me di cuenta de los soportes se utilizan para definir un anónimo función y luego llámalo. por ejemplo:

(function (msg){alert(msg)})('hello'); 

... define una función y luego lo llama, pasando 'hola' como un parámetro.

Así que el ejemplo de la pregunta: ¿

(function ($) { 
    //majority of code here... 
})(jQuery); 

está pasando jQuery en una función anónima y refiriéndose a ella como $ dentro de la función, una forma de garantizar que los $ trabajará para jQuery sin interferir con cualquier otra cosa .

+1

Por alguna razón, esta explicación hizo clic un poco mejor conmigo :) ¡Gracias! – JoshP

Cuestiones relacionadas