localstorage - 保存数组答案

【问题标题】：localstorage - save array [duplicate]localstorage - 保存数组
【发布时间】：2014-05-24 09:15:50
【问题描述】：

我有本地存储，可以保存输入并将它们推送到列表中。现在我想将列表保存在本地存储中，因为当我重新加载列表时，因为var fav = new Array(); 在此jsFiddle 的开头定义了。我该如何解决这个问题？

谢谢，本

【问题讨论】：

在保存之前将其转换为 json 并在检索时对其进行解码
您想将fav 数组存储在localStorage 中吗？由于var 声明，您的列表不会在加载时重置，它正在重置是因为您没有将其保存在任何地方，并且在刷新时，fav 是一个新变量。要将fav 数组存储在localStorage 中，您必须将其存储为字符串。见这里：link
这能回答你的问题吗？ Storing Objects in HTML5 localStorage

【解决方案1】：

真的很简单，只需要使用JSON数据保存即可：

// Save
var datas = ["1", "2", "3"];
localStorage["datas"] = JSON.stringify(datas);

// Retrieve
var stored_datas = JSON.parse(localStorage["datas"]);

【讨论】：

谢谢，这行得通；但是，一旦我重新加载页面并存储新字符串，数组就会重置。新的 jsFiddle：jsfiddle.net/sG99W/3
@Andy 我设法通过检查数组是否为空来解决这个问题。再次感谢您的解决方案。 jsfiddle.net/sG99W/5
这是@Arthur 的解决方案，不是我的。
任何人都知道为什么当我 console.log(stored_datas);??

【解决方案2】：

有些人得到undefined的原因是因为JS..例如，如果你运行[][0]它是undefined。上面安迪/亚瑟的答案最初对我来说在本地工作，但最终在生产中中断。我通过使用方法/语法defined in the MDN docs 来修复它...

设置一个值：

const myArray = []
localStorage.setItem('myArray', JSON.stringify(myArray))

获取值：

const myArrayFromLocalStorage = localStorage.getItem('myArray')
if (myArrayFromLocalStorage && myArrayFromLocalStorage.length) {
const myArray = JSON.parse(myArrayFromLocalStorage)
}

清除一个值：

localStorage.removeItem('myArray')

【讨论】：

【解决方案3】：

使用localDataStorage 很容易做到这一点，您可以在其中透明地设置/获取以下任何“类型”：Array、Boolean、Date、Float、Integer、Null、Object 或 String。

[DISCLAIMER] 我是该实用程序的作者 [/DISCLAIMER]

例子：

localDataStorage.set( 'key1', 'Belgian' );
localDataStorage.set( 'key2', 1200.0047 );
localDataStorage.set( 'key3', true );
localDataStorage.set( 'key4', { 'RSK' : [1,'3',5,'7',9] } );
localDataStorage.set( 'key5', null );

localDataStorage.get( 'key1' );   -->   'Belgian'
localDataStorage.get( 'key2' );   -->   1200.0047
localDataStorage.get( 'key3' );   -->   true
localDataStorage.get( 'key4' );   -->   Object {RSK: Array(5)}
localDataStorage.get( 'key5' );   -->   null

如您所见，原始值受到尊重。在您的情况下，我们会这样做：

>localDataStorage.set( 'datas', ["1", "2", "3"] );

请注意，我们不需要对键值进行任何字符串化。您可以清楚明确地指定它。现在，当我们检索它时...

>localDataStorage.get( 'datas' ) -->

...我们会得到：

>(3) ["1", "2", "3"]

正是我们开始时的样子，无需转换任何东西。

【讨论】：

【解决方案4】：

如果你想防止你的变量被重置，试试这个，如果你想重新加载页面并保留旧值，这无济于事。

  if (typeof fav === 'undefined'){
        var fav = new Array();}

【讨论】：