Variabili e scope in JavaScript: come funzionano e perché sono importanti

Introduzione

Le variabili sono uno dei concetti fondamentali in JavaScript. Permettono di memorizzare e gestire dati dinamici, come numeri, stringhe, oggetti o risultati di operazioni. Ogni variabile ha un ambito (scope), che ne determina la visibilità e la durata nel codice.

In questo articolo vedremo come dichiarare variabili, quali parole chiave usare (var, let, const) e come funziona lo scope in JavaScript, con esempi chiari e consigli pratici.

Dichiarare variabili: var, let, const
Fino al 2015, in JavaScript si usava solo var. Con ES6 sono stati introdotti let e const, che offrono più controllo sullo scope e la mutabilità delle variabili.

Esempio:

var nome = "Mario";     // variabile classica
let eta = 30;           // variabile modificabile, con scope locale
const PI = 3.14;        // costante, non modificabile

var: ha function scope, è accessibile ovunque nella funzione
let e const: hanno block scope, visibili solo all’interno del blocco { … }
const: obbliga a non riassegnare la variabile
Scope: globale, di funzione, di blocco

Lo scope determina dove una variabile è accessibile.

Scope globale

let x = 10;

function stampa() {
  console.log(x); // accede a x
}

Scope di funzione

function test() {
  let y = 5;
  console.log(y);
}
// console.log(y); // Errore: y non è definito fuori dalla funzione

Scope di blocco (solo con let e const)

if (true) {
  let z = 20;
  console.log(z); // ok
}
// console.log(z); // Errore

Hoisting

Con var, le dichiarazioni vengono “sollevate” in cima alla funzione:

console.log(a); // undefined
var a = 5;

Con let e const, invece, l’uso prima della dichiarazione genera errore.

Buone pratiche

• Usa const per valori che non devono cambiare
• Usa let per variabili modificabili nel tempo
• Evita var nei progetti moderni
• Mantieni lo scope il più piccolo possibile
• Dai nomi descrittivi alle variabili

Esempio pratico

function calcolaPrezzo(sconto) {
const prezzoBase = 100;
let prezzoFinale = prezzoBase - (prezzoBase * sconto / 100);
return prezzoFinale;
}

console.log(calcolaPrezzo(10)); // 90

In questo esempio, prezzoBase è una costante, mentre prezzoFinale è calcolata dinamicamente.