Introduzione a JavaScript: variabili, costanti e scope

by Anastasia P.
SHARE
Introduzione a JavaScript: variabili, costanti e scope
© Guida-HTML5.it

Introduzione

Quando si inizia a studiare JavaScript, uno dei primi passi davvero importanti è capire come salvare e organizzare i dati nel codice. È qui che entrano in gioco variabili, costanti e scope. Anche se possono sembrare concetti base, in realtà sono fondamentali per scrivere codice chiaro, sicuro e facile da mantenere.

In un progetto reale, JavaScript deve spesso gestire informazioni come il nome di un utente, il prezzo di un prodotto, lo stato di un pulsante o il risultato di un calcolo. Senza una buona comprensione di questi strumenti, il codice tende a diventare confuso, fragile e difficile da correggere.

In questo tutorial vedremo come dichiarare dati con let e const, quando usarli, come funziona lo scope e quali errori evitare. L’obiettivo è costruire una base solida per affrontare qualsiasi altro argomento di JavaScript con maggiore sicurezza.

Codice completo

// Esempio completo: gestione di dati semplici in JavaScript

// Costante: valore che non deve essere riassegnato
const nomeApplicazione = "Task Manager";

// Variabile: valore che può cambiare nel tempo
let numeroTask = 3;

// Dato iniziale
let utente = "Sara";

// Funzione che mostra un riepilogo
function mostraRiepilogo() {
  console.log("Applicazione:", nomeApplicazione);
  console.log("Utente:", utente);
  console.log("Task iniziali:", numeroTask);
}

// Uso iniziale
mostraRiepilogo();

// Aggiorniamo alcuni valori
utente = "Marco";
numeroTask = numeroTask + 2;

// Mostriamo di nuovo il riepilogo
mostraRiepilogo();

// Esempio di scope di blocco
if (numeroTask > 4) {
  let stato = "Hai molte attività da gestire";
  console.log(stato);
}

// console.log(stato); // Errore: stato non è accessibile fuori dal blocco

// Esempio di costante con oggetto
const impostazioni = {
  tema: "scuro",
  notifiche: true
};

// Possiamo modificare una proprietà dell´oggetto
impostazioni.tema = "chiaro";

console.log("Impostazioni aggiornate:", impostazioni);

Spiegazione

Il codice precedente mostra alcuni concetti chiave di JavaScript in modo pratico.

1. const per i valori che non devono cambiare

La costante nomeApplicazione viene dichiarata con const. Questo significa che il suo riferimento non può essere riassegnato. È la scelta giusta per valori che devono restare stabili, come il nome di un progetto, un URL base o una configurazione fissa.

Per esempio:

  • nome dell’applicazione
  • numero massimo di tentativi
  • valore di una tassa

Usare const aiuta a evitare modifiche accidentali e rende il codice più leggibile, perché comunica chiaramente l’intenzione del programmatore.

2. let per i valori che possono cambiare

La variabile numeroTask è dichiarata con let, perché il suo valore cambia nel tempo. Questo è utile in tutti i casi in cui il dato viene aggiornato durante l’esecuzione del programma.

Ad esempio:

  • contatori
  • stati temporanei
  • risultati di calcoli progressivi

Nel nostro esempio, il numero di task aumenta di 2. Questo tipo di aggiornamento è frequente nelle applicazioni web, soprattutto quando si gestiscono interazioni con l’utente o dati dinamici.

3. Lo scope: dove una variabile è visibile

Lo scope indica in quale parte del codice una variabile può essere usata. In JavaScript moderno, let e const hanno uno scope di blocco. Questo significa che una variabile dichiarata dentro un blocco { ... } esiste solo lì dentro.

Nel codice, la variabile stato viene dichiarata dentro l’istruzione if. Per questo motivo non può essere letta fuori dal blocco. Se provassimo a usare console.log(stato) dopo il blocco, otterremmo un errore.

Questo comportamento è molto utile perché limita la visibilità dei dati e riduce il rischio di conflitti tra variabili.

4. Oggetti dichiarati con const

Un aspetto che spesso crea confusione riguarda gli oggetti. Quando dichiari un oggetto con const, non puoi riassegnarlo a un nuovo oggetto, ma puoi modificare le sue proprietà.

Nel nostro esempio:

  • impostazioni è una costante
  • la proprietà tema viene modificata da scuro a chiaro

Questo accade perché const blocca il riferimento, non il contenuto interno dell’oggetto. È un dettaglio importante da conoscere per evitare errori di interpretazione.

5. Perché questo argomento è fondamentale

Saper usare bene variabili, costanti e scope è essenziale perché questi concetti compaiono in quasi ogni programma JavaScript. Li troverai quando:

  • gestisci form e input utente
  • crei logica condizionale
  • lavori con array e oggetti
  • scrivi funzioni riutilizzabili
  • interagisci con API e dati esterni

In altre parole, questo è uno dei pilastri del linguaggio. Se lo padroneggi bene, il resto dello studio diventa molto più semplice.

Best practice

Per scrivere JavaScript più pulito e professionale, conviene seguire alcune regole pratiche.

  • Usa const di default quando il valore non deve essere riassegnato.
  • Usa let solo quando serve davvero, cioè se il valore cambia nel tempo.
  • Evita var nei nuovi progetti: ha uno scope meno intuitivo e può creare bug difficili da individuare.
  • Scegli nomi chiari per variabili e costanti, in modo che il codice si capisca anche senza commenti.
  • Limita lo scope delle variabili al blocco più piccolo possibile.
  • Non riutilizzare lo stesso nome in contesti diversi se può creare confusione.

Un esempio di nome poco chiaro è x o dati. Molto meglio usare nomi come numeroUtenti, totaleOrdine o statoPagamento. Un buon nome rende il codice più leggibile e riduce il bisogno di spiegazioni aggiuntive.

Un’altra buona abitudine è dichiarare le variabili vicino al punto in cui vengono usate. Questo aiuta a mantenere il codice ordinato e a comprendere meglio il flusso logico del programma.

Riepilogo

In questo tutorial abbiamo visto come iniziare a usare JavaScript in modo più consapevole attraverso tre concetti fondamentali:

  • const per i valori che non devono cambiare
  • let per i valori dinamici
  • scope per capire dove una variabile è accessibile

Abbiamo anche visto che gli oggetti dichiarati con const possono comunque avere proprietà modificabili, e che lo scope di blocco aiuta a scrivere codice più sicuro e ordinato. Queste basi sono indispensabili per affrontare con successo argomenti più avanzati come funzioni, array, oggetti complessi, moduli e asincronia.

Se vuoi migliorare davvero in JavaScript, il consiglio è semplice: esercitati a scrivere piccoli esempi, osserva come cambiano i valori e prova a prevedere il comportamento del codice prima di eseguirlo. È uno dei modi migliori per imparare in profondità.

Approfondisci con risorse ufficiali

Per continuare lo studio con fonti affidabili, ti consiglio queste risorse ufficiali:

  • MDN Web Docs - let: documentazione completa e chiara su let e lo scope.
  • MDN Web Docs - const: spiegazione dettagliata dell’uso di const e delle sue caratteristiche.
  • MDN Web Docs - Scope: approfondimento sul concetto di visibilità delle variabili.
  • JavaScript.info: tutorial molto utile per consolidare le basi con esempi pratici.
  • ECMAScript Language Specification: la specifica ufficiale del linguaggio, utile per chi vuole andare oltre il livello introduttivo.

Studiare da fonti ufficiali ti aiuta a distinguere le buone pratiche dalle abitudini sbagliate e a costruire basi solide per sviluppare applicazioni JavaScript moderne e affidabili.

SHARE