JavaScript

Var, let e const: qual è la scelta giusta per dichiarare variabili in JavaScript?

Var, let e const: qual è la scelta giusta per dichiarare variabili in JavaScript?
LT
Luca Terribili
Autore

var, let e const non sono tre gusti equivalenti dello stesso gelato: var è arrivata con il JavaScript delle origini (1995), let e const sono arrivate con ES6 nel 2015 per risolvere problemi che var aveva creato per vent'anni. Non è un caso che gran parte delle guide di stile moderne — Airbnb, Google — vietino var del tutto nel codice nuovo.

Il problema di var non è solo lo scope di funzione invece che di blocco: è l'hoisting silenzioso. Una variabile var dichiarata più in basso nel codice è già "esistente" (con valore undefined) fin dall'inizio della funzione, e questo può nascondere bug sottili — un if che sembra dichiarare una variabile locale in realtà la sta scrivendo su uno scope condiviso con tutto il resto della funzione. let e const risolvono il problema con la "zona morta temporale": accedere alla variabile prima della sua dichiarazione lancia un errore esplicito, invece di restituire silenziosamente undefined.

Un equivoco comune su const: non rende immutabile il valore, rende immutabile solo il binding. const arr = [] impedisce di riassegnare arr a un nuovo array, ma non impedisce affatto arr.push(1) — stai modificando il contenuto, non il riferimento. Se serve vera immutabilità sugli oggetti, const da solo non basta: serve Object.freeze() o strutture immutabili dedicate. Non è sorprendente vedere questo dilemma discusso animatamente sui social network, spesso con opinioni concitate. Ma qual è la scelta giusta? In questo articolo esamineremo le differenze tra var, let e const, discuteremo i loro vantaggi e svantaggi e ti aiuterò a prendere la decisione migliore per il tuo progetto. Alla fine, spero che tu sarai in grado di scegliere con sicurezza quale opzione utilizzare ogni volta che devi dichiarare una variabile in JavaScript.

In JavaScript, var, let e const sono tre diversi modi per dichiarare variabili. Ecco una breve descrizione delle principali differenze tra queste tre parole chiave:

Var

var è la parola chiave più vecchia per dichiarare variabili in JavaScript. Le variabili dichiarate con var hanno un'ampia portata. Ciò significa che sono visibili all'interno di tutto il blocco di codice in cui vengono dichiarate, nonché in tutti i sottoblocchi di codice. Ad esempio:

if (true) {
    var x = 10;
}
console.log(x); // 10

In questo esempio, la variabile x è visibile all'interno del blocco di codice del ramo if, nonché al di fuori di esso.

Inoltre, le variabili dichiarate con var possono essere ri-dichiarate. Ciò significa che è possibile dichiarare una variabile con lo stesso nome più volte nello stesso ambito. Ad esempio:

var x = 10;
var x = 20;
console.log(x); // 20

In questo esempio, la seconda dichiarazione di x sovrascrive il valore della prima dichiarazione.

Let

Anche la parola chiave let in JavaScript viene utilizzata per dichiarare una variabile, ma a differenza di var, è limitata da una portata di blocco. Ciò significa che la variabile è visibile solo all'interno del blocco di codice in cui viene dichiarata e in tutti i sottoblocchi di codice al suo interno. Ad esempio:

if (true) {
    let y = 10;
}
console.log(y); // ReferenceError: y is not defined

In questo esempio, la variabile y è visibile solo all'interno del blocco di codice del ramo if e non al di fuori di esso.

A differenza delle variabili dichiarate con var, le variabili dichiarate con let non possono essere ri-dichiarate nello stesso ambito. Ciò significa che non è possibile dichiarare una variabile con lo stesso nome più volte nello stesso blocco di codice. Ad esempio:

let z = 10;
let z = 20; // SyntaxError: Identifier 'z' has already been declared

Inoltre, le variabili dichiarate con let possono essere modificate durante l'esecuzione del programma. Ad esempio:

let a = 10;
a = 20;
console.log(a); // 20

In questo esempio, il valore della variabile a viene modificato da 10 a 20 durante l'esecuzione del programma.

In sintesi, la parola chiave let è un'ottima alternativa alla parola chiave var per dichiarare le variabili in JavaScript. Offre una portata di blocco più ristretta e impedisce la ri-dichiarazione di variabili con lo stesso nome. Tuttavia, è ancora possibile modificare il valore delle variabili dichiarate con let durante l'esecuzione del programma.

Const

La parola chiave const in JavaScript viene utilizzata per dichiarare una costante, ovvero una variabile che non può essere modificata durante l'esecuzione del programma. Ad esempio:

const PI = 3.14;
PI = 3.14159; // TypeError: Assignment to constant variable.

In questo esempio, si tenta di modificare il valore della costante PI, ma viene generato un errore, poiché le costanti non possono essere modificate.

A differenza delle variabili dichiarate con var, le costanti dichiarate con const hanno una portata di blocco. Ciò significa che sono visibili solo all'interno del blocco di codice in cui vengono dichiarate e in tutti i sottoblocchi di codice al suo interno. Ad esempio:

if (true) {
    const MAX_SIZE = 100;
}
console.log(MAX_SIZE); // ReferenceError: MAX_SIZE is not defined

Inoltre, a differenza delle variabili dichiarate con let, le costanti dichiarate con const non possono essere ri-dichiarate nello stesso ambito. Ciò significa che non è possibile dichiarare una costante con lo stesso nome più volte nello stesso blocco di codice.

In sintesi, la parola chiave const è un'ottima alternativa alla parola chiave var per dichiarare le variabili in JavaScript quando si desidera impedire la modifica del valore durante l'esecuzione del programma. Tuttavia, è necessario fare attenzione a non utilizzare const per variabili il cui valore può cambiare durante l'esecuzione del programma, poiché ciò genererebbe un errore.

Conclusioni

Ognuna di queste opzioni per dichiarare una variabile ha caratteristiche uniche e può essere utilizzata in modi differenti per risolvere problemi di diversa complessità.

Le variabili dichiarate con var hanno un'ampia portata e possono essere ri-dichiarate, il che può portare a confusione e problemi di debug. Se hai bisogno di una portata di blocco più ristretta o se desideri evitare la ri-dichiarazione di variabili, dovresti considerare l'utilizzo di let o const.

La parola chiave let offre una portata di blocco più ristretta rispetto a var e impedisce la ri-dichiarazione di variabili con lo stesso nome. Tuttavia, le variabili dichiarate con let possono essere modificate durante l'esecuzione del programma. Se hai bisogno di una variabile il cui valore può cambiare durante l'esecuzione del programma, ma desideri evitare la ri-dichiarazione e desideri una portata di blocco più ristretta, let potrebbe essere la scelta giusta.

La parola chiave const è l'opzione migliore per dichiarare le variabili in JavaScript quando si desidera impedire la modifica del valore durante l'esecuzione del programma. Le costanti dichiarate con const hanno una portata di blocco e non possono essere ri-dichiarate, il che le rende ideali per valori che dovrebbero rimanere costanti per tutta la durata del programma. Tuttavia, è necessario fare attenzione a non utilizzare const per variabili il cui valore può cambiare durante l'esecuzione del programma, poiché ciò genererebbe un errore.

La regola pratica che si è consolidata nella community è semplice: usa const di default, passa a let solo quando sai già che dovrai riassegnare il valore, e non usare più var — non perché sia "vietato" per principio, ma perché ogni suo comportamento controintuitivo (hoisting, scope di funzione, ri-dichiarazione silenziosa) è stato risolto meglio da chi è venuto dopo.

Articoli correlati

Vedi tutti →