Funzione anonima vs. funzione denominata separata per l'inizializzazione in jquery

Diciamo che abbiamo del codice che viene utilizzato per inizializzare le cose quando viene caricata una pagina e assomiglia a questo:

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

La funzione initStuff viene chiamata solo dalla terza riga dello snippet. Mai più. Quindi di solito le persone lo inseriscono in un callback anonimo come questo:

$(document).ready(function() { 
    //Body of initStuff
});

Avere la funzione in una posizione dedicata nel codice non aiuta davvero con la leggibilità, perché con la chiamata su ready () è ovvio che si tratta di codice di inizializzazione.

Ci sono altri motivi per preferire l'uno all'altro?

Come menzionato da @ Stargazer712, il primo ingombra lo spazio dei nomi globale, quindi il secondo è il vincitore IMHO. Ora, detto questo, poiché stai usando una funzione anonima nel secondo esempio, il callstack del tuo debugger sarà inutile e otterrà risultati diversi a seconda del debugger che usi. Di solito, quello che finisco per fare è:

$(document).ready(function MODULE_init() { 
    //Body of initStuff
});

In questo modo, lo spazio dei nomi globale non si ingombra e hai un utile callstack.

Tendo ad usare la convenzione di cui sopra in tutte le definizioni di funzioni anonime (beh, non più anonime;)). È una convenzione che ho trovato sfogliando il codice JS di Firefox.

Modifica: ora detto tutto ciò, Oliver evidenzia un buon punto con i test unitari. Quanto sopra ha lo scopo di fungere da wrapper per operazioni più complesse, non per ospitare una tonnellata di codice non testato.

Direi che in questo caso probabilmente non importa, ma se hai funzioni di callback anonime, chiamate altre funzioni di callback anonime, tendo ad usare il primo approccio, poiché rende il codice molto più leggibile e più facile da seguire.

Per quanto riguarda i test unitari, il primo approccio sarebbe migliore, in quanto si sarebbe in grado di testare la initstufffunzione in modo isolato.

Vorrei scegliere il primo, per leggibilità / debug / test, ecc. Puoi evitare il problema del disordine globale dello spazio dei nomi semplicemente creando uno spazio dei nomi locale per tutte le funzioni della tua pagina. Uso lo stile di notazione degli oggetti, come raccomandato da Paul Irish (vedere le diapositive 13-15 su http://paulirish.com/2009/perf/ )

var MYPAGE = {
  onReady : function(){
  // init code
  },
  someOtherCallback : function(){}
};

jQuery(document).ready(MYPAGE.onReady);

Esiste anche un terzo modo di registrare i metodi init senza ingombrare lo spazio dei nomi globale che preferisco:

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

È breve ed evita la ricerca di documenti DOM come

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

lo fa.