Perché "$ (). Ready (handler)" non è consigliato?

Dal sito della documentazione dell'API jQuery perready

Tutte e tre le seguenti sintassi sono equivalenti:

• $ (documento) .ready (gestore)
• $ (). ready (gestore) (non consigliato)
• $ (gestore)

Dopo aver fatto i compiti - leggere e giocare con il codice sorgente , non ho idea del perché

$().ready(handler) 

non è consigliato. Il primo e il terzo modo sono esattamente gli stessi, la terza opzione chiama la funzione ready su un oggetto jQuery memorizzato nella cache con document:

rootjQuery = jQuery(document);
...
...

// HANDLE: $(function)
// Shortcut for document ready
} else if ( jQuery.isFunction( selector ) ) {
    return rootjQuery.ready( selector );
}

Ma la funzione ready non ha alcuna interazione con il selettore degli elementi del nodo selezionato, Il readycodice sorgente:

ready: function( fn ) {
    // Attach the listeners
    jQuery.bindReady();
        // Add the callback
    readyList.add( fn );
        return this;
},

Come puoi vedere, aggiunge semplicemente il callback a una coda interna ( readyList) e non cambia o utilizza gli elementi nel set. Ciò consente di chiamare la readyfunzione su ogni oggetto jQuery.

Piace:

• selettore regolare : $('a').ready(handler) DEMO
• Selettore di sciocchezze : $('fdhjhjkdafdsjkjriohfjdnfj').ready(handler) DEMO
• Selettore non definito : $().ready(handler) DEMO

Infine ... alla mia domanda: perché $().ready(handler)non è consigliato?

Ho ricevuto una risposta ufficiale da uno degli sviluppatori jQuery:

$().ready(fn)funziona solo perché $()era una scorciatoia per $(document) _{(jQuery <1.4)}
Quindi $().ready(fn)era un codice leggibile.

Ma le persone erano solite fare cose del genere $().mouseover()e ogni sorta di altra follia.
e le persone dovevano fare $([])per ottenere un oggetto jQuery vuoto

Quindi in 1.4 l'abbiamo cambiato in modo da $()dare un jQuery vuoto e abbiamo appena fatto $().ready(fn)funzionare in modo da non rompere un sacco di codice

$().ready(fn) è letteralmente ora solo patchato nel core per farlo funzionare correttamente per il caso legacy.

Il posto migliore per la readyfunzione è $.ready(fn), ma è una decisione di design davvero vecchia ed è quello che abbiamo ora.

Gli ho chiesto:

Pensi che $ (fn) sia più leggibile di $ (). Ready (fn)?!

La sua risposta è stata:

Faccio sempre $ (document) .ready (fn) nelle app reali e in genere c'è solo un blocco pronto per i documenti nell'app non è esattamente come una cosa di manutenzione.

Penso che anche $ (fn) sia abbastanza illeggibile , è solo una cosa che devi sapere funziona ™ ...

Poiché le diverse opzioni fanno più o meno la stessa cosa che hai indicato, è ora di indossare il cappello da scrittore della biblioteca e fare alcune ipotesi.

1. Forse le persone jQuery vorrebbero avere a $()disposizione per un uso futuro (dubbio dato che $().readyè documentato per funzionare, anche se non consigliato; inquinerebbe anche la semantica di casi $speciali).

2. Un motivo molto più pratico: la seconda versione è l'unica che non finisce per avvolgere document, quindi è più facile rompere quando si mantiene il codice. Esempio:

   // BEFORE
   $(document).ready(foo);
   
   // AFTER: works
   $(document).ready(foo).on("click", "a", function() {});
   

   Confronta questo con

   // BEFORE
   $().ready(foo);
   
   // AFTER: breaks
   $().ready(foo).on("click", "a", function() {});
   

3. In relazione a quanto sopra: readyè un mostro nel senso che è (l'unico?) Metodo che funzionerà allo stesso modo indipendentemente da ciò che l'oggetto jQuery avvolge (anche se non avvolge nulla come nel caso qui). Questa è una grande differenza rispetto alla semantica di altri metodi jQuery, quindi fare affidamento su questo è giustamente scoraggiato.

   Aggiornamento: come sottolinea il commento di Esailija, da un punto di vista ingegneristico readydovrebbe davvero essere un metodo statico proprio perché funziona in questo modo.

Aggiornamento # 2: Scavando alla fonte, sembra che ad un certo punto nel ramo 1.4 sia $()stato cambiato per abbinarlo $([]), mentre in 1.3 si è comportato come $(document). Questa modifica rafforzerebbe le giustificazioni di cui sopra.

Direi che è semplicemente il fatto che $()restituisce un oggetto vuoto mentre $(document)non lo fa per l'applicazione ready()a cose diverse; funziona ancora, ma direi che non è intuitivo.

$(document).ready(function(){}).prop("title") // the title
$().ready(function(){}).prop("title")  //null - no backing document

Molto probabilmente questo è solo un bug della documentazione e dovrebbe essere corretto, l'unico svantaggio dell'utilizzo $().ready(handler)è la sua leggibilità. Certo, sostiene che $(handler)è altrettanto illeggibile. Sono d'accordo, ecco perché non lo uso .

Puoi anche sostenere che un metodo è più veloce di un altro. Tuttavia, quante volte chiami questo metodo abbastanza volte di seguito su una singola pagina per notare una differenza?

Alla fine si tratta di preferenze personali. Non ci sono svantaggi nell'usare un $().ready(handler)argomento diverso da quello della leggibilità. Penso che in questo caso la documentazione sia mancante.

Solo per rendere palesemente ovvio che c'è qualche incongruenza nei tre, in più ho aggiunto la quarta forma spesso usata: (function($) {}(jQuery));

Con questo markup:

<div >one</div>
<div>two</div>
<div id='t'/>

e questo codice:

var howmanyEmpty = $().ready().find('*').length;
var howmanyHandler = $(function() {}).find('*').length;
var howmanyDoc = $(document).ready().find('*').length;
var howmanyPassed = (function($) { return $('*').length; }(jQuery));
var howmanyYuck = (function($) {}(jQuery));
var howmanyYuckType = (typeof howmanyYuck);

$(document).ready(function() {
    $('#t').text(howmanyEmpty + ":" + howmanyHandler + ":" 
        + howmanyDoc + ":" + howmanyPassed + ":" + howmanyYuckType);
});

I risultati visualizzati del div dall'ultima istruzione sono: 0: 9: 9: 9: undefined

COSÌ, solo le versioni Handler e Doc sono coerenti con la convenzione jQuery di restituire qualcosa di utile poiché ottengono il selettore di documenti e con il modulo Passed devi restituire qualcosa (non lo farei, penserei, ma inseriscilo per mostrare "dentro" che ha qualcosa).

Ecco una versione violina di questo per i curiosi: http://jsfiddle.net/az85G/

Penso che questo sia davvero più per la leggibilità che per qualsiasi altra cosa.

Questo non è così espressivo

$().ready(handler);

come

$(document).ready(handler)

Forse stanno cercando di promuovere una qualche forma di jQuery idiomatica.