javascript 如何在事先不知道密钥的情况下检索所有 localStorage 项目？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17745292/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to retrieve all localStorage items without knowing the keys in advance?
提问by user1942359
I want to show all of the keys and storage written before. My code is below. I created a function (allStorage) but it doesn't work. How can I do this?
我想显示之前编写的所有密钥和存储。我的代码如下。我创建了一个函数 (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));
}
}
回答by
If you modify your function to this you can list all items based on key (will list the items only):
如果您将函数修改为此，您可以根据键列出所有项目（将仅列出项目）：
function allStorage() {
var values = [],
keys = Object.keys(localStorage),
i = keys.length;
while ( i-- ) {
values.push( localStorage.getItem(keys[i]) );
}
return values;
}
Object.keysis a new addition to JavaScript (ECMAScript 5). It lists all own keys on an object which is faster than using a for-in loop which is the option to this.
Object.keys是 JavaScript (ECMAScript 5) 的新增功能。它列出了一个对象上的所有自己的键，这比使用 for-in 循环更快，这是一个选项。
However, this will not show the keys. For that you need to return an object instead of an array (which is rather point-less IMO as this will bring you just as far as you were before with localStorage just with a different object - but for example's sake):
但是，这不会显示密钥。为此，您需要返回一个对象而不是数组（这是毫无意义的 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;
}
If you want a compact format listing then do this instead - here each item in the array will have key=itemwhich you later can split into pairs and so forth:
如果您想要一个紧凑的格式列表，那么请改为执行此操作 - 此处数组中的每个项目都将拥有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;
}
回答by Alexey Prokhorov
The easiest way in ES2015+ is:
ES2015+ 中最简单的方法是：
const items = { ...localStorage };
回答by Dziad Borowy
localStorageis not an array, but an object, so try sth. like this:
localStorage不是一个数组，而是一个对象，所以试试…… 像这样：
for (var a in localStorage) {
console.log(a, ' = ', localStorage[a]);
}
回答by JD May
// iterate localStorage
for (var i = 0; i < localStorage.length; i++) {
// set iteration key name
var key = localStorage.key(i);
// use key name to retrieve the corresponding value
var value = localStorage.getItem(key);
// console.log the iteration key and value
console.log('Key: ' + key + ', Value: ' + value);
}
回答by Grumpy
The easiest way would be to use:
最简单的方法是使用：
return JSON.stringify(localStorage);
回答by Igor Yar
for (let [key, value] of Object.entries(localStorage)) {
console.log(`${key}: ${value}`);
}
回答by David Burson
A little more succinct:
再简洁一点：
function getAllLocalStorage() {
return Object.keys(localStorage)
.reduce((obj, k) => {
return { ...obj, [k]: localStorage.getItem(k)}}, {});
}
