¿Qué significa esta sintaxis de JavaScript/jQuery?

Question

¿Qué significa la siguiente sintaxis?

(function($){ 
    $.fn.columnize = function(options) { 
    ... 

¿Qué es function($)?

¿Qué es $.fn. …?

Answer 1

Esta convención se utiliza al escribir plugins para asegurar que no hay confilict con otras librerías Javascript utilizando el $ notación, mientras asegurando el autor del plugin todavía puede usar este notataion:

(function($){ 
    ... 
})(jQuery); 

el autor declara una función anónima con un solo parámetro ($), e inmediatamente llamar a ella y pasar el objeto jQuery para él. Esto asegura que se llama a la función y que todo está definido en ella.

Una notación más largo podría ser:

function MyDefs($){ 
    ... 
} 
MyDefs(jQuery); 

A pesar de eso crearía una variable MyDefs en el espacio de nombres global. El patrón de función anónimo deja el espacio de nombres global vacío, evitando conflictos.

Answer 2

Declara la función columnize como un complemento jQuery que le permite usarlo en elementos como este $('.someSelector').columnize(). Puede leer más sobre plugin authoring here.

Answer 3

Acabo de encontrar esto ... ¿es un patrón Proxy?

patrón Proxy

Combinando el conocimiento anterior se da como un desarrollador de JavaScript toda una gran cantidad de energía. Una forma de combinar eso es implementar un patrón proxy en JavaScript, permitiendo a los fundamentos de la programación orientada a aspectos (AOP):

(function() { 
    // log all calls to setArray 
    var proxied = jQuery.fn.setArray; 
    jQuery.fn.setArray = function() { 
    console.log(this, arguments); 
    return proxied.apply(this, arguments); 
    }; 
})(); 

Lo anterior envuelve su código en una función para ocultar el "proxy" -Variable. Guarda el método setArray de jQuery en un cierre y lo sobrescribe. El proxy registra todas las llamadas al método y delega la llamada al original. El uso de apply (this, arguments) garantiza que el que llama no podrá notar la diferencia entre el método original y el proxy.

Answer 4

Es probablemente una extensión de jQuery, que básicamente pasan (jQuery) al final como

(function($){ 
    //$ is jQuery here 

    //added columnize function to existing jQuery object 
    $.fn.columnize = function(options) { 

    } 

})(jQuery); 

Answer 5

No se confundan con el $. En realidad, $ es un nombre de variable válido en JavaScript (como todas las variables que contienen $, source (PDF)).

Así, la primera línea podría ser reformulada como

(function (someVariable) { 

que podría parecer más común. Por lo demás, sí, es un patrón de proxy, y la respuesta de James Wiseman es explicar qué está sucediendo.

Answer 6

function($) {...} define una función anónima con un parámetro formal llamado $. $.fn se refiere a la propiedad denominada fn del objeto al que hace referencia la variable $.