jQuery document.ready vs auto llamada función anónima

120

¿Cuál es la diferencia entre estos dos.jQuery document.ready vs auto llamada función anónima

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

Son estas dos funciones llamadas al mismo tiempo? Lo sé, document.ready se activará cuando el navegador muestre toda la página HTML, pero ¿qué ocurre con la segunda función (función anónima de llamada automática)? ¿Espera a que el navegador complete la representación de la página o se invoca cada vez que se encuentra?

Fuente

2010-07-15 Ashit Vora

+15

Por lo que vale la pena, '$ (function() {});' es equivalente a '$ (document) ready (function() {});' –

Se ejecutará la auto llamando a la función anónima cada vez que se encuentra. Además, presentar el documento en pantalla y crear el modelo de objetos en la memoria no están relacionados. – Anurag

relacionado: [¿Por qué definir la función anónima y pasarla jQuery como argumento?] (Http://stackoverflow.com/q/10371539/1048572) en qué patrón usar con la red troncal – Bergi

document.ready se ejecuta después de DOM se "construye". Las funciones de invocación automática se ejecutan instantáneamente, si se insertan en <head>, antes de que se construya DOM.

Fuente

2010-07-15 20:02:58 srigi

+1 para contrarrestar un downvote innecesario. Sin embargo, hay un pequeño problema en tu respuesta. La función de invocación automática se ejecutará donde sea que se encuentre al analizar, y no necesariamente tiene que estar dentro del '', y las reglas no son diferentes una vez que se haya construido el DOM inicial. – Anurag

(function(){...})(); se ejecutará tan pronto como se encuentre en el Javascript.

$(document).ready() se ejecutará una vez que se carga el documento. $(function(){...}); es un atajo para $(document).ready() y hace exactamente lo mismo.

Fuente

2010-07-15 20:05:55 Michal

106

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

Esta función es llamada cuando el DOM is ready lo que significa, puede comenzar a consulta elementos, por ejemplo. .ready() usará diferentes formas en diferentes navegadores para asegurarse de que el DOM esté realmente listo.
(function(){ ... })();

Eso es otra cosa que una función que invoca sí tan pronto como sea posible cuando el navegador está interpretando su ecma-/javascript. Por lo tanto, es muy poco probable que pueda actuar con éxito en DOM elements aquí.

Fuente

2010-07-15 20:06:49 jAndy

@phpGeek eres lo contrario de derecho – NimChimpsky

@NimChimpsky I confundido (función() {}); con $ (función() {}). Eres lo contrario de lo incorrecto;) – ALH

Estoy confundido, con respecto a '(function() {...})();' ¿no se ejecuta ningún código JS tan pronto como sea posible? Si tuvieras que decir, 'alert()' dentro del SIAF o fuera de él, ¿no sería el mismo efecto? – skube

$(document).ready(function() { ... }); simplemente une esa función a la ready caso del documento, por lo que, como usted ha dicho, cuando se carga el documento, desencadena el evento.
(function($) { ... })(jQuery); es en realidad una construcción de Javascript, y todo lo que pieza de código hace es pasar el objeto jQuery en function($) como parámetro y ejecuta la función, por lo que dentro de esa función, $ siempre se refiere al objeto jQuery. Esto puede ayudar a resolver conflictos namespacing, etc.

Así # 1 se ejecuta cuando se carga el documento, mientras que # 2 se ejecuta inmediatamente, con el objeto jQuery llamado $ como forma abreviada.

Fuente

2010-07-15 20:08:31

El siguiente código se ejecutará cuando el DOM (Modelo de objeto de documento) esté listo para la ejecución del código JavaScript.

$(document).ready(function(){ 
    // Write code here 
});

La mano corta para el código anterior es:

$(function(){ 
    // write code here 
});

El código que se muestra a continuación es una función anónima JavaScript auto-invocando, y se ejecutará tan pronto como navegador interpreta que:

(function(){ 
    //write code here 
})(); // It is the parenthesis here that call the function.

La función de invocación automática de jQuery que se muestra a continuación, pasa el objeto jQuery global como un argumento al function($) . Esto permite que $ se use localmente dentro de la función de autoinvocación sin necesidad de para recorrer el alcance global de una definición. jQuery no es la única biblioteca que hace uso de $, por lo que este reduce los posibles conflictos de nomenclatura.

(function($){ 
    //some code 
})(jQuery);

Fuente

2015-09-17 01:52:10

Explicación muy simple, clara y concisa de los cierres javascript. –

jQuery document.ready vs auto llamada función anónima

Respuesta

Cuestiones relacionadas