JavaScript Academy · Lezione

Il pattern dei moduli (IIFE)

Incapsuli il codice con funzioni invocate immediatamente.

Il pattern dei moduli (IIFE) è una lezione JavaScript Academy gratuita su CoddyKit. Questa è la lezione 3 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento JavaScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso JavaScript Academy include 4 lezioni in totale.

Cosa risolve il module pattern

Prima degli ES modules, il module pattern permetteva di raggruppare stato e comportamento correlati mantenendo private le parti interne ed esponendo una API pubblica chiara. Si basa sulle closure.

L'IIFE

Una IIFE (Immediately Invoked Function Expression) è una funzione che viene eseguita nel momento stesso in cui viene definita. Racchiuderla tra parentesi e chiamarla crea immediatamente uno scope privato.

const result = (function () {
  return 42;
})();
console.log(result); // 42

Perché eseguirla immediatamente

L'IIFE offre uno scope privato temporaneo senza lasciare in giro una funzione con nome. Tutto ciò che si trova al suo interno è isolato dal namespace globale.

(function () {
  const temp = "not global";
  console.log(temp);
})();
// temp is unreachable out here

Restituire una API pubblica

Il module pattern è una IIFE che restituisce un oggetto. I metodi dell'oggetto sono closure sulle variabili private e formano l'interfaccia pubblica.

const counter = (function () {
  let count = 0; // private
  return {
    inc: () => ++count,
    value: () => count
  };
})();
counter.inc();
console.log(counter.value()); // 1

Privato e pubblico

Qualsiasi elemento dichiarato all'interno ma non restituito rimane privato. È accessibile solo ciò che viene inserito nell'oggetto restituito.

const calc = (function () {
  const pi = 3.14159; // private constant
  return {
    area: (r) => pi * r * r
  };
})();
console.log(calc.area(2)); // 12.56636
console.log(calc.pi);      // undefined

Helper privati

Le funzioni helper possono risiedere all'interno del modulo ed essere utilizzate dai metodi pubblici senza essere mai esposte.

const validator = (function () {
  const clean = (s) => s.trim().toLowerCase(); // private
  return {
    isEmail: (s) => clean(s).includes("@")
  };
})();
console.log(validator.isEmail(" A@B.com ")); // true

Il revealing module pattern

Una variante diffusa definisce tutte le funzioni privatamente, poi restituisce un oggetto che "rivela" i riferimenti a quelle pubbliche. Mantiene chiaro l'elenco della API pubblica in fondo.

const store = (function () {
  let items = [];
  function add(x) { items.push(x); }
  function count() { return items.length; }
  return { add, count }; // reveal
})();
store.add("a");
console.log(store.count()); // 1

Singleton

Poiché l'IIFE viene eseguita una sola volta, un modulo è di fatto un singleton: esiste esattamente una sola istanza con un unico insieme di stato privato.

const config = (function () {
  let settings = { theme: "dark" };
  return {
    get: (k) => settings[k],
    set: (k, v) => { settings[k] = v; }
  };
})();
config.set("theme", "light");
console.log(config.get("theme")); // "light"

Passare le dipendenze

È possibile passare variabili globali o altri moduli come argomenti della IIFE, rendendo esplicite le dipendenze e permettendo una minificazione sicura.

const mathUtils = (function (M) {
  return { roundUp: (n) => M.ceil(n) };
})(Math);
console.log(mathUtils.roundUp(4.1)); // 5

Evitare l'inquinamento globale

L'obiettivo è avere un solo nome globale (il modulo) invece di decine di variabili non organizzate. Questo previene le collisioni tra i nomi nei diversi script.

Relazione con i moduli ES

Oggi import/export offrono un vero scope di modulo a livello del linguaggio, sostituendo in gran parte questo pattern. Tuttavia, comprendere i moduli basati su IIFE aiuta a chiarire il funzionamento della privacy e dell'incapsulamento, e sarà ancora possibile incontrarli nel codice legacy.

Verifica rapida

Il module pattern e le IIFE.

Riepilogo

Il module pattern usa una IIFE per creare uno scope privato e restituisce un oggetto i cui metodi sono closure sullo stato nascosto. Le parti interne restano private; solo i membri restituiti sono pubblici. Varianti come il revealing module pattern rendono più chiara la API, e i moduli si comportano come singleton. Gli import/export ES hanno ormai sostituito questo pattern, ma si basano sulle stesse idee.

Domande Frequenti

La lezione «Il pattern dei moduli (IIFE)» è gratuita?

Sì — il testo completo di «Il pattern dei moduli (IIFE)» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso JavaScript Academy, passa a CoddyKit PRO. Il corso JavaScript Academy include 4 lezioni in totale.

Cosa imparerò in «Il pattern dei moduli (IIFE)»?

Incapsuli il codice con funzioni invocate immediatamente. Eserciti JavaScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.

Ho bisogno di esperienza per iniziare JavaScript Academy?

Non è richiesta alcuna esperienza precedente. JavaScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 3 di 4.

Quanto tempo richiede la lezione «Il pattern dei moduli (IIFE)»?

La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.

Posso scrivere ed eseguire codice in questa lezione JavaScript Academy?

Sì. Ogni lezione JavaScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.

Tutte le lezioni di questo corso

← Torna a JavaScript Academy