Uso de las funciones de autocomunicación anónima y $ (documento) .ready

Question

Acabo de enterarme recientemente de las funciones de auto llamada anónima. Algunos fragmentos de código que encontré usaron la función de auto llamada junto con $ (document) .ready. Parece redundante, o inútil, usar ambos.

¿Existe un caso en el que tendría que utilizar

(function(){ 
    $(document).ready(); 
})(); 

vs

$(document).ready(function(){ 
    (function(){})(); 
}); 

Calculo que cualquiera querría el script para ser ejecutado de inmediato o después de la DOM cargado. No puedo entender por qué usarías ambos juntos.

Gracias.

Answer 1

Definitivamente hay un caso de uso para el primer ejemplo. Si tiene otras librerías/scripts JS cargadas en la misma página, no hay garantía de que no sobrescriban la variable $. (Esto es muy común cuando tienes Prototype y jQuery en la misma página).

Por lo tanto, si Prototype usa $, deberá usar jQuery en cualquier momento que desee trabajar con jQuery. Esto puede llegar a ser muy feo:

jQuery(function(){ 
    jQuery('a', '#content').bind('click', function(){ 
     if(jQuery(this).attr('href') == 'www.google.com') 
     { 
      alert("This link goes to Google"); 
      jQuery(this).addClass('clicked')); 
     } 
    }); 
}) 

Recuerde, no podemos usar $ ya que es un método de prototipo en el ámbito global.

Pero si lo envolvió en el interior de esta ..

(function($){ 
    $(function(){ 

     // your code here 

    }); 
})(jQuery); 

El $ realidad haría referencia a la biblioteca jQuery interior, mientras que todavía en referencia al prototipo en el exterior!Esto puede ayudar a poner en orden su código:

(function($){ 
    $(function{}(
     jQuery('a', '#content').bind('click', function(){ 
      if(jQuery(this).attr('href') == 'www.google.com') 
      { 
       alert("This link goes to Google"); 
       jQuery(this).addClass('clicked')); 
      } 
     }); 
    )); 
})(jQuery); 

Este es un patrón común con extensiones de jQuery para asegurar que siempre se agregan al objeto jQuery, pero se pueden escribir con $ para mantener el código ordenado.

Answer 2

No querrá usar ambas cosas juntas, ¿hay algo que esté haciendo que lo requiera?

En la documentación de la API jQuery aquí, http://api.jquery.com/ready/, se puede ver estos ejemplos:

El ready() método se utiliza típicamente con una función anónima:

$ (document) ready (function() {
// Controlador para .ready() llamado.

});

cual es equivalente a llamar:

$ (function() {.
// Manejador de ready() llamada

});

Pero no estoy seguro de si esto responde a su pregunta porque no veo dónde en realidad lo hace. Espero que esto ayude de la misma manera!

Answer 3

La única razón por la que presentaría otro cierre es introducir otro límite de alcance para cargar/proteger objetos globales como $.

Por ejemplo:

$(document).ready(function(){ 

    // Do upper scope things. 

    (function(){ 

     // Do lower scope things. 

    })(); 

}); 

basada en tus diciendo recientemente ha aprender acerca de estas cosas Asumo que son relativly nuevo en JavaScript.

He creado una publicación de blog que podría ayudar a explicar algunos de los conceptos básicos desde el punto de vista de un recién llegado a JavaScript, incluido el alcance de la función. http://bit.ly/tLkykX