Storage (Local/Session)
Local Storage e Session Storage
Introduzione all’uso del Web Storage in JavaScript per memorizzare dati direttamente nel browser, distinguendo tra Local Storage e Session Storage.
Introduzione
Il Web Storage permette di salvare coppie chiave-valore all’interno del browser. A differenza dei cookie, i dati non vengono inviati al server e possono essere più capienti. Esistono due principali meccanismi:
- localStorage: dati persistenti fino alla loro cancellazione manuale o da codice, i dati rimangono anche se chiudi la scheda o l’intero browser, persistono finché non vengono rimossi da codice (removeItem, clear) o dall’utente tramite le impostazioni del browser (svuotando cache o dati di navigazione).
- sessionStorage: dati disponibili solo durante la sessione corrente, si cancellano chiudendo il browser o la scheda.
Uso del localStorage
Con localStorage possiamo salvare, leggere e cancellare dati persistenti.
Codice Esempio: utilizzo localStorage

// Salvataggio
localStorage.setItem("nome", "Anna");
// Lettura
let valore = localStorage.getItem("nome");
console.log(valore); // Anna
// Rimozione
localStorage.removeItem("nome");
// Pulizia totale
localStorage.clear();
Uso del sessionStorage
sessionStorage funziona allo stesso modo, ma i dati spariscono alla chiusura della scheda.
Codice Esempio: utilizzo sessionStorage

// Salvataggio
sessionStorage.setItem("colore", "blu");
// Lettura
console.log(sessionStorage.getItem("colore")); // blu
// Rimozione
sessionStorage.removeItem("colore");
Gestione di dati complessi
Poiché localStorage e sessionStorage accettano solo stringhe, per salvare oggetti o array è necessario usare JSON.stringify e JSON.parse.
Codice Esempio: salvataggio oggetto

let utente = { nome: "Luca", eta: 25 };
// Conversione in stringa e salvataggio
localStorage.setItem("utente", JSON.stringify(utente));
// Recupero e parsing
let dati = JSON.parse(localStorage.getItem("utente"));
console.log(dati.nome); // Luca
Tabella riassuntiva
Metodo | Descrizione | Applicazione |
---|---|---|
setItem | Salva una coppia chiave-valore | localStorage o sessionStorage |
getItem | Recupera un valore tramite chiave | Restituisce stringa o null |
removeItem | Cancella un valore specifico | Chiave richiesta |
clear | Svuota tutto lo storage | Non selettivo |
Considerazioni
localStorage e sessionStorage sono strumenti pratici per gestire dati lato client senza ricorrere a cookie o database esterni. La scelta tra i due dipende dalla durata dei dati desiderata. Per strutture complesse è necessario l’uso di JSON.