Cos'è la portata in JavaScript?

L'ambito (Scope) in JavaScript è il contesto in cui sono definite e accessibili variabili e funzioni.

In parole semplici, determina dove nel codice si può fare riferimento a una variabile o funzione.

Esistono diversi tipi di ambito:

• Ambito globale (Global Scope): Le variabili dichiarate fuori da qualsiasi funzione si trovano nell'ambito globale. Sono accessibili da qualsiasi punto del codice.

  // Variabile globale
  let globalVar = "Sono visibile ovunque";
  
  function showGlobal() {
    console.log(globalVar); // Disponibile all'interno della funzione
  }
  
  showGlobal();
  

• Ambito locale (Local/Function Scope): Le variabili dichiarate all'interno di una funzione sono nell'ambito locale di quella funzione. Sono accessibili solo all'interno di essa e nelle funzioni annidate, ma non dall'esterno.

  function showLocal() {
    // Variabile locale
    let localVar = "Vedo solo qui";
    console.log(localVar);
  }
  
  showLocal();
  // console.log(localVar); // Errore: localVar non definita
  

• Ambito di blocco (Block Scope): Introdotto in ES6 (ES2015) con let e const. Le variabili dichiarate con let o const all'interno di parentesi graffe ({}), come blocchi di codice, cicli o condizioni, hanno ambito di blocco. Le variabili dichiarate con var non hanno ambito di blocco.

  if (true) {
    // Variabile con ambito di blocco
    let blockVar = "Visibile solo in questo blocco";
    console.log(blockVar);
  }
  
  // console.log(blockVar); // Errore: blockVar non definita
  
  for (let i = 0; i < 2; i++) {
    // Variabile con ambito di blocco nel ciclo
    console.log(i);
  }
  
  // console.log(i); // Errore: i non definita (se si usa let)
  

È anche importante comprendere il concetto di catena di scope (Scope Chain). Quando JavaScript cerca il valore di una variabile, inizia dall'ambito corrente. Se non la trova, passa all'ambito esterno (genitore), e così via, fino all'ambito globale. Se non viene trovata, viene generato un errore ReferenceError.