添加/追加项目到本地存储/网络存储？

Question

我知道localstorage只是一个简单的散列图，getItem and setItem。如果我的项目是一个JSON数组，并且我只想在数组的末尾添加一个项目会怎么样？有没有比调用setItem多一个条目更有效的方法？

Answer 1

不幸的是没有。

localStorage仅支持string类型，因此您必须在保存之前先对JSON进行排序，这意味着您需要先加载并解析它，然后才能向其添加任何内容。

你可以写一个简单的包装要做到这一点（可支持各种类型）：

function appendItem(key, data) { 

    var t = data.constructor, tmp; 

    switch(t) { 

     case Array: 
      tmp = localStorage.getItem(key); 
      tmp = (tmp === null) ? [] : JSON.parse(tmp); 
      tmp.push(data); 

      localStorage.setItem(key, JSON.stringify(tmp)); 
      break; 

     case String: 
      //... and so forth 
    } 
} 

（错误和同类型检查也必须在这种方法中实现）。

（可选）您可以使用延迟写入方法，以便您可以更高效地填充阵列（突发写入），并且仅在需要时将数据更新为localStorage。在这里您可以初始加载现有的数组，然后在数据添加到数组时进行更新。

您可以烤到这一点对每个数组的对象，但是为了简单：

var a = []; //load existing array at init 
var timer; 
var key = 'myArray'; 

//append data to array and re-start timer 
function appendArray(item) { 

    clearTimeout(timer); 
    a.push(item); 

    timer = setTimout(writeData, 2000); //wait 2 seconds to write last append(s) 
} 

//write the data if dirty 
function writeData() { 
    localStorage.setItem(key, JSON.stringify(a)); 
} 

为了安全，你可以订阅window.onunload事件，当用户离开当前页面离开做最后的写操作。