[jQuery]anonymous self-invoking function e anonymous function document.ready

di il
3 risposte

[jQuery]anonymous self-invoking function e anonymous function document.ready

Salve a tutti ho un dubbio riguardo le funzioni anonime di self-invoking che vengono eseguite immediatamente non appena vengono rilevate da JavaScript e document.ready dove la funzione viene eseguita solo quando il documento (DOM) è completamente caricato e sicuro da manipolare. Mi chiedo quale utilizzare se l'anonymous self-invoking o l'anonymous document.ready. Qui riporto 2 esempi di codice.
(function($) {
            function code...
        })(jQuery);
Nel primo esempio la funzione anonima viene eseguita immediatamente non appena viene rilevata da JavaScript senza attendere il caricamento completo del documento (DOM).
$(function() {
            function code...
        });
Nel secondo esempio la funzione anonima è una scorciatoia di document.ready e viene eseguita solo quando il documento (DOM) è completamente caricato e sicuro da manipolare. Tra questi 2 esempi quale è meglio utilizzare? Se in una pagina gli elementi DOM sono già definiti nel codice HTML è meglio utilizzare l'anonymous self-invoking e invece se gli elementi del DOM sono creati dinamicamente durante il caricamento è meglio utilizzare l'anonymous document.ready? Ho questo dubbio nella mia testa e non saprei quale utilizzare .

3 Risposte

  • Re: [jQuery]anonymous self-invoking function e anonymous function document.ready

    Ciao fede,
    Dipende da quello che vuoi ottenere

    Il documento HTML viene elaborato dall'alto al basso. Appena viene trovato un pezzo di codice javascript, il browser smette di elaborare il DOM ed esegue il codice. Per questo motivo, se inserisci una IIFE (Immediatly Invoked Function Expression) in cima ad una pagina HTML, non avrai accesso al resto del DOM.

    In linea di massima, è meglio evitare di usare codice javascript che interrompa il caricamento della pagina, perché all'utente potrebbe sembrare che la pagina non stia funzionando, quando in realtà è solo il codice javascript che ne sta rallentando la visualizzazione.

    Quindi, se vuoi inserire del codice nel tag HEAD (o comunque ogni qualvolta usi del javascript per modificare elementi nella pagina) ti consiglio di usare il metodo che sfrutta document.ready. In alternativa, puoi inserire il codice in fondo al documento ed usare una semplice IIFE.

    Per quanto riguarda il caricamento del documento, non c'è differenza fra usare una IIFE o inserire direttamente il codice javascript. La vera differenza è che in questo modo le variabili dentro alla funzione anonima non saranno accessibili dall'esterno e manterranno lo scope gloable più pulito (fidati che è qualcosa di buono )
  • Re: [jQuery]anonymous self-invoking function e anonymous function document.ready

    Ciao l'IIFE l'ho utilizzata al di fuori del tag head ma quindi le funzioni anonime fanno in modo che le variabili dentro alla funzione anonima non sono accessibili dall'esterno e mantengono lo scope gloable più pulito? Grazie per la disponibilità.
  • Re: [jQuery]anonymous self-invoking function e anonymous function document.ready

    Le funzioni anonime di per sé hanno vari utilizzi, ma una IIFE (che è una funzione anonima che viene chiamata istantaneamente) viene usata praticamente solo per mantenere pulito lo scope
Devi accedere o registrarti per scrivere nel forum
3 risposte