如何在不事先知道密钥的情况下检索所有localStorage项？

Question

我想要显示之前编写的所有密钥和存储。我的代码如下。我创建了一个函数(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));
        }
    }

Answer 1

如果你修改你的函数，你可以基于key列出所有的项目(将只列出项目)：

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)的新成员。它列出了对象上的所有own键，这比使用for-in循环更快，而for-in循环是它的选项。

但是，这不会显示密钥。为此，你需要返回一个对象而不是一个数组(这是相当无关紧要的，因为这会给你带来和以前使用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;
}

Answer 2

在ES2015+中最简单的方法是：

const items = { ...localStorage };

Answer 3

localStorage不是一个数组，而是一个对象，所以可以尝试一些东西。如下所示：

for (var a in localStorage) {
   console.log(a, ' = ', localStorage[a]);
}