Question

我有一对密钥和值存储在localStorage中。我想将存储在那里的所有记录放入数组中：

function fillRecordArray(){
    recordArr.splice(0,recordArr.length);
    for(var i in localStorage) 
    {
        var record = new Record(i,localStorage[i]);
        recordArr.push(record);
    }   
}

在我停止使用Chrome并在Mozilla上测试之前，哪种方法完全正常。在这种情况下，除了我保存的数据之外，我还获得了6个额外的数组元素：

1
function key() { [native code] }
function getItem() { [native code] }
function setItem() { [native code] }
function removeItem() { [native code] }
function clear() { [native code] }

什么可能导致这个问题，有没有办法避免它，除了从数组中剥离它？

提前谢谢。

Answer 1

Firefox正在为您提供存储API对象：https://developer.mozilla.org/en-US/docs/Web/API/Storage。这是设计的，所以我认为没有办法避免它。

如果要删除额外的功能，可以尝试将值转换为特定类型。

有趣的是Chrome还实现了WebAPI。如果Chrome没有返回这些功能，那么您可能需要检查获取/访问/传递“记录”的方式。有些东西可能会改变它的类型。

Answer 2

使用for循环迭代localStorage的长度，而不是for循环。

for(var i=0; i<localStorage.length; i++){
    var record = new Record(i, localStorage.getItem(localStorage.key(i)));
    recordArr.push(record);
}

但是，我更愿意将记录存储在localStorage中的单个容器下，而不是将它们作为根密钥存放。

例如：

// store the array
localStorage.setItem('records', JSON.stringify(recordsArr);

// retrieve the array
var retrievedRecords = localStorage.getItem('records');
if(retrievedRecords){
    retrievedRecords = JSON.parse(retrievedRecords);
} else {
    retrievedRecords = [];
}

Answer 3

使用Object.keys()，Array.prototype.forEach()

var keys = Object.keys(localStorage);

keys.forEach(function(key) {
  // do stuff
  console.log(localStorage[key]);
  var record = new Record(key, localStorage[key]);
  recordArr.push(record);
})

Answer 4

这应该适用于两种浏览器......＆＃34; hasOwnProperty＆＃34;将数据与函数分开

recordArr = [];
for(var i in localStorage)
{
  if ( localStorage.hasOwnProperty(i) )
  {
    recordArr.push(i);
  }
}

使用多个浏览器从localStorage获取不需要的数据

4 个答案: