Ottieni le chiavi HTML5 localStorage

Mi sto solo chiedendo come ottenere tutti i valori chiave localStorage.

Ho provato a recuperare i valori con un semplice ciclo JavaScript

for (var i=1; i <= localStorage.length; i++)  {
   alert(localStorage.getItem(i))
}

Funziona solo se i tasti sono numeri progressivi, a partire da 1.

Come ottengo tutte le chiavi per visualizzare tutti i dati disponibili?

in ES2017 puoi usare:

Object.entries(localStorage)

for (var key in localStorage){
   console.log(key)
}

EDIT: questa risposta sta ricevendo molti voti, quindi immagino sia una domanda comune. Sento di doverlo a chiunque possa inciampare nella mia risposta e pensare che sia "giusto" solo perché è stato accettato di fare un aggiornamento. La verità è che l'esempio sopra non è proprio il modo giusto per farlo. Il modo migliore e più sicuro è farlo in questo modo:

for ( var i = 0, len = localStorage.length; i < len; ++i ) {
  console.log( localStorage.getItem( localStorage.key( i ) ) );
}

Mi piace creare un oggetto facilmente visibile da questo in questo modo.

Object.keys(localStorage).reduce(function(obj, str) { 
    obj[str] = localStorage.getItem(str); 
    return obj
}, {});

Faccio una cosa simile anche con i cookie.

document.cookie.split(';').reduce(function(obj, str){ 
    var s = str.split('='); 
    obj[s[0].trim()] = s[1];
    return obj;
}, {});

function listAllItems(){  
    for (i=0; i<=localStorage.length-1; i++)  
    {  
        key = localStorage.key(i);  
        alert(localStorage.getItem(key));
    }  
}

È possibile utilizzare la localStorage.key(index)funzione per restituire la rappresentazione in formato stringa, dove si indextrova l'ennesimo oggetto che si desidera recuperare.

Se il browser supporta HTML5 LocalStorage, dovrebbe anche implementare Array.prototype.map, abilitando questo:

Array.apply(0, new Array(localStorage.length)).map(function (o, i) {
    return localStorage.key(i);
})

Dal momento che la domanda menzionata trovava le chiavi, ho pensato di menzionare che per mostrare ogni chiave e coppia di valori, potresti farlo in questo modo (basato sulla risposta di Kevin):

for ( var i = 0, len = localStorage.length; i < len; ++i ) {
  console.log( localStorage.key( i ) + ": " + localStorage.getItem( localStorage.key( i ) ) );
}

Ciò registrerà i dati nel formato "chiave: valore"

(Kevin: sentiti libero di inserire queste informazioni nella tua risposta se vuoi!)

Questo stamperà tutte le chiavi e i valori su localStorage:

ES6:

for (let i=0; i< localStorage.length; i++) {
    let key = localStorage.key(i);
    let value = localStorage[key];
    console.log(`localStorage ${key}:  ${value}`);
}

Puoi ottenere chiavi e valori come questo:

for (let [key, value] of Object.entries(localStorage)) {
  console.log(`${key}: ${value}`);
}

Sono d'accordo con Kevin che ha la risposta migliore ma a volte quando hai chiavi diverse nella tua memoria locale con gli stessi valori, ad esempio, vuoi che i tuoi utenti pubblici vedano quante volte hanno aggiunto i loro articoli nei loro cesti, devi mostrare loro il anche quante volte puoi usare questo:

var set = localStorage.setItem('key', 'value');
var element = document.getElementById('tagId');

for ( var i = 0, len = localStorage.length; i < len; ++i ) {
  element.innerHTML =  localStorage.getItem(localStorage.key(i)) + localStorage.key(i).length;
}

Per quelli che menzionano l'uso di Object.keys(localStorage)... non perché non funzionerà in Firefox (ironicamente perché Firefox è fedele alle specifiche). Considera questo:

localStorage.setItem("key", "value1")
localStorage.setItem("key2", "value2")
localStorage.setItem("getItem", "value3")
localStorage.setItem("setItem", "value4")

Perché key, getItem e setItem sono Object.keys(localStorage)solo metodi prototipali ["key2"].

È meglio fare qualcosa del genere:

let t = [];
for (let i = 0; i < localStorage.length; i++) {
  t.push(localStorage.key(i));
}

Possiamo anche leggere per nome.

Supponiamo di aver salvato il valore con il nome "utente" in questo modo

localStorage.setItem('user', user_Detail);

Quindi possiamo leggerlo usando

localStorage.getItem('user');

L'ho usato e funziona senza problemi, non è necessario eseguire il ciclo for