Puede alguien explicar qué función ($) hace en jQuery

Question

Hace poco estaba leyendo algún otro código, y me encontré con esto:

// Semicolon (;) to ensure closing of earlier scripting 
// Encapsulation 
// $ is assigned to jQuery 
;(function($) { 

    // DOM Ready 
    $(function() { 
     ... 
    }); 

})(jQuery); 

entiendo el punto del líder, y entiendo que $ (function() {es lo mismo que documento listo, pero ¿para qué sirve agregar la función ($)?

Entiendo que es un cierre, pero como esto siempre se llama en el ámbito global, parece que no se Necesito molestarme con esto. El $ (función() {usará el mismo objeto global en ambos sentidos, no?

¿Es para proteger contra algo, o es una mejor práctica por otra razón?

Answer 1

Es una estructura común para un plugin jQuery. Protege contra el identificador $ que se sobrescribió y se utilizó para otra cosa. Dentro de la función anónima, $ siempre se referirá a jQuery.

Ejemplo:

$ = "oh no"; 
$(function() { //Big problem! 
    //DOM ready 
}); 

Mediante la introducción de un nuevo ámbito, se puede asegurar que $ se refiere a lo que esperas que:

$ = "oh no"; 
(function($) { //New scope, $ is redeclared and jQuery is assigned to it 

    $(function() { //No problem! 
     //DOM ready 
    }); 

}(jQuery)); 

El razonamiento principal detrás de esto es que numerosas otras bibliotecas de JavaScript use $ como un identificador (por ejemplo, PrototypeJS). Si desea utilizar tanto Prototype como jQuery, debe dejar que Prototype tenga su identificador $, pero probablemente no desee escribir jQuery cada vez que desee llamar a un método jQuery. Al introducir un nuevo ámbito, permite que jQuery tenga su $ en ese contexto de ejecución.

Answer 2

El ejemplo de código que nos ha facilitado es un ejemplo de una auto-La invocación de la función:

(function(){ 
// some code… 
})(); 

El primer conjunto de paréntesis define una función: (una función anónima envuelto en paréntesis)

(function() {}) 

Eso define la función anónima. Por sí solo, no hace nada. Pero si agrega un conjunto de paréntesis () después de la definición, es igual que los paréntesis utilizados para llamar a una función. Trate de hacer esto:

(function(message) { 
    alert(message); 
})("Hello World"); 

que crea una función que acepta un parámetro, y muestra un cuadro de alerta que contiene el valor proporcionado. Luego, inmediatamente llama a esa función con un parámetro de "Hola mundo".

---

En su ejemplo, se define una función de autoinvocación. Acepta un parámetro, que se llama $. Entonces, la función se llama inmediatamente, con una referencia a jQuery que se transfiere como argumento.

Esto es común si desea que jQuery funcione en modo noConflict() (que elimina la referencia global a $).

En noConflict() modo, todavía se puede acceder a jQuery a través de la variable global jQuery, pero la mayoría de la gente prefiere usar $, por lo que esta función de auto-llamada acepta la variable global jQuery como un parámetro llamado $ en el ámbito de la función, lo que le permite utilizar el atajo $ dentro de la función de autoinvocación mientras tiene jQuery en modo noConflicto() para evitar conflictos con otras bibliotecas que usan $ en el ámbito global.

Espero que responda a su pregunta!