[解決済み] キーを事前に知らなくてもlocalStorageの全アイテムを取得するには？

質問

以前書いたキーとストレージを全て表示させたい。 私のコードは以下の通りです。関数(allStorage)を作りましたが、うまくいきません。 どうすればいいのでしょうか？

    function storeUserScribble(id) {
        var scribble = document.getElementById('scribble').innerHTML;
        localStorage.setItem('userScribble',scribble);
    }

    function getUserScribble() {
        if ( localStorage.getItem('userScribble')) {
            var scribble = localStorage.getItem('userScribble');
        }
        else {
            var scribble = 'You can scribble directly on this sticky... and I will also remember your message the next time you visit my blog!';
        }
        document.getElementById('scribble').innerHTML = scribble;
    }

    function clearLocal() {
        localStorage.clear();
        return false;
    }

    function allStorage() {
        var archive = [];
        for (var i = 0; i<localStorage.length; i++) {
            archive[i] = localStorage.getItem(localStorage.key(i));
        }
    }

どのように解決するのですか？

このように関数を修正すると、キーに基づいたすべての項目をリストアップすることができます（項目のみをリストアップします）。

function allStorage() {

    var values = [],
        keys = Object.keys(localStorage),
        i = keys.length;

    while ( i-- ) {
        values.push( localStorage.getItem(keys[i]) );
    }

    return values;
}

Object.keys はJavaScript (ECMAScript 5) に新しく追加されたものです。これはオブジェクトのすべてのキーをリストアップするもので、これのオプションであるfor-inループを使うよりも高速になります。

しかし、これではキーは表示されません。そのためには、配列の代わりにオブジェクトを返す必要があります（これはむしろ無意味なIMOであり、localStorageで以前行ったのと同じように、異なるオブジェクトであなたをもたらすでしょう - しかし、例のために）。

function allStorage() {

    var archive = {}, // Notice change here
        keys = Object.keys(localStorage),
        i = keys.length;

    while ( i-- ) {
        archive[ keys[i] ] = localStorage.getItem( keys[i] );
    }

    return archive;
}

コンパクトな形式のリストが必要な場合は、代わりにこのようにします - ここでは、配列の各項目に key=item で、後でペアに分割したりすることができます。

function allStorage() {

    var archive = [],
        keys = Object.keys(localStorage),
        i = 0, key;

    for (; key = keys[i]; i++) {
        archive.push( key + '=' + localStorage.getItem(key));
    }

    return archive;
}