如果分配对象而不是键，如何删除本地存储？

Question

我有这段代码为 localStorage 分配对象。标签/窗口关闭后如何删除？

localSotrage['data'] = JSON.stringify({folder1: {logedIn: 1}, folder2: {logedIn: 0}, folder3: {logedIn: 1}});

我尝试过使用

delete window.localStorage['data'] 和 window.localStorage.removeItem(data) 和 localStorage.removeItem(data)

但不工作。当我关闭浏览器并再次访问它时，它会直接引导我进入登录页面。关于如何做的任何帮助？提前非常感谢

Answer 1

如果你想要这种行为，我认为你应该使用 sessionStorage，但在这种特殊情况下，我会使用：

window.onbeforeunload = function() { delete localStorage['data']; };

要删除值及其键，将其设置为 null 将保留键。

顺便说一句，您在代码中拼错了 localStorage，只是让您知道 =)

Answer 2

如果您想删除保存在 localStorage 中的特定项目，您可以这样做：

localStorage.setItem("key", "value"); // Set a value with a "key"
localStorage.getItem("key"); // Get the value associated with "key"
localStorage.removeItem("key"); // Remove value associated with "key"

您还可以清除所有本地存储。这是通过以下方式完成的：

localStorage.clear();

然后你将清除localStorage中的所有数据。

您可以对 sessionStorage 做同样的事情。使用相同的方法。

Answer 3

只需将值设置为null 或undefined：

localSotrage['data'] = null;

你也可以使用：

delete localStorage.data   //or 
localStorage.removeItem("data")

Answer 4

处理本地存储的正确方法是使用Storage API，其中包括setItem、getItem和removeItem方法 - 这样做而不是 的直接属性访问。使用 API 将在浏览器（如果支持）和在本地存储 shims 上可靠地工作。

（以下显示API的工作原理；如果有错误，请注意确切它所说的内容。）

localStorage.clear();                // reset for examples

localStorage.setItem("data", "hi!")
localStorage.length                  // -> 1
localStorage.getItem("data")         // -> "hi!"

localStorage.setItem("data", null)   // set value to null
localStorage.length                  // -> 1 (key NOT removed!)
localStorage.getItem("data")         // -> null

localStorage.removeItem("data")      // remove key
localStorage.length                  // -> 0 (key really WAS removed!)
localStorage.getItem("data")         // -> null

使用上述 API 的另一个原因是 localStorage.setItem("getItem", "foo") 不会破坏 localStorage.getItem 的下一次使用，因为存储键/值对和存储 object 属性保持明显不同。 p>

---

在 Chrome 中（可能还有其他地方），delete 运算符，从普通 JavaScript 对象中删除属性“有效”。出于各种原因，我不推荐或使用这种速记。

1. W3C API 根本没有没有讨论/定义它
2. 混淆了JS属性和底层模型；考虑localStorage['getItem'] 和变体，如上所述
3. 它不能也不能在垫片上工作

例如，无论如何：

localStorage["data"] = "hi!"
localStorage.getItem("data")        // -> "hi!"
localStorage["data"]                // -> "hi!"
localStorage.hasOwnProperty["data"] // -> true (exposed property in Chrome)

delete localStorage["data"]
localStorage.getItem("data")        // -> null
localStorage["data"]                // -> undefined
localStorage.hasOwnProperty["data"] // -> false (property is gone)

见Deleting from localStorage: should I use delete or .removeItem?