javascript - 如何存储和更新具有不同数据类型属性的 localStorage 键对象？

Question

这是我第一次使用 localStorage，我想存储一个 localStorage 键，它是一个具有不同数据类型属性的对象，例如键“localstor”，它是一个包含两个属性的对象:

localstor= { userMsg : String , userInfo : (Object) { ID: String , username: String , pwd :String } }

属性 userMsg 是 String 类型，而属性 userInfo 是 object 类型。

我知道如何设置和获取仅包含基于对象的项目 this question ，但就我而言，我不知道如何设置和获取这种 key ？特别是如果我想更新 localstor 中的对象 userInfo，该怎么做？

感谢任何帮助。

Answer 1

我不知道我是否理解了你的问题，如果理解了，请告诉我以便我可以更正我的答案，但我认为你正在尝试做的是使用 操作你保存在缓存中的项目localStorage，而这个数据，例如，是一个包含多种类型数据的对象。

因此，假设您有对象 localstor(我添加了一些选项卡以便更容易查看和调试)；

var localstor = {
  userMsg : "Message",
  userInfo :{
              ID: "SomeID",
              username: "SomeUsername",
              pwd : "SomePassword"
            }
}

将它放入 localStorage 非常容易(正如您指出的那样您已经知道该怎么做)所以您只需要选择一个键即可。在这里，我选择“obj”作为键:

localStorage.setItem("obj", JSON.stringify(localstor));

您可能已经注意到，我使用了函数 JSON.stringify()。我这样做是因为你有一个对象，里面有对象，你需要把它转换成一个 String 来存储它。 JavaScript 已经内置了此功能，因此您无需安装任何东西。

我现在如何检索和更新 localstor 对象？

非常简单。我使用 localStorage.getItem() 函数检索对象，传递我之前设置的“obj”，这个结果我需要将它转换回对象类型(因为我们将它存储为之前的字符串，还记得吗？)使用 JSON.parse() 函数。之后，我可以像编辑任何其他对象一样编辑该对象的属性:

localstor = JSON.parse(localStorage.getItem("obj"));
localstor.userInfo.username = "AnotherUsername"; 

我可以将新对象设置回 LocalStorage:

localStorage.setItem("obj", JSON.stringify(localstor));

就是这样!现在，当我再次检索它时，用户名的新值将在那里。

完整代码在这里:

var localstor = {
      userMsg : "Message",
      userInfo :{
                  ID: "SomeID",
                  username: "SomeUsername",
                  pwd : "SomePassword"
                }
    }

    //Put the localstor object into the cache
    localStorage.setItem("obj", JSON.stringify(localstor));


    //Retrieve the object
    localstor = JSON.parse(localStorage.getItem("obj"));
    //Change the username property
    localstor.userInfo.username = "AnotherUsername"; 
    //And put the editted object back to cache
    localStorage.setItem("obj", JSON.stringify(localstor)); 

如果您还有任何疑问，请告诉我，以便我更好地回答!