如何使用 Javascript 和/或 Jquery 删除本地存储中对象内的键？答案

【问题标题】：How to delete a key within an object in local storage with Javascript and/or Jquery?如何使用 Javascript 和/或 Jquery 删除本地存储中对象内的键？
【发布时间】：2016-11-25 20:03:03
【问题描述】：

在本地存储中，我有一个名为 favourites 的对象，它包含这个..

"{
    "id3333":{
        "URL":"somewhere.comm/page1/",
        "TITLE":"Page 1 Title",
    },
    "id4444":{
        "URL":"somewhere.comm/page2/",
        "TITLE":"Page 2 Title",
    }
}"

如何根据 ID 删除对象（例如 id3333 和 id4444）

我已经尝试了以下以及其他一些巫术......

localStorage.removeItem('id3333'); // no errors, no removal
localStorage.removeItem('favourites':'id3333'); // SyntaxError: missing ) after argument list
localStorage.removeItem('favourites[id3333]'); // no errors, no removal
localStorage.removeItem('id3333', JSON.stringify('id3333')); // no errors, no removal

另外，我需要根据一个变量来获取要删除的键名，所以像这样..

var postID = 'id3333';
localStorage.removeItem(postID);

或

var objectName = 'favourites';
var postID = 'id3333';
localStorage.removeItem(objectName[postID]);

是否可以直接删除嵌套项，还是需要检索完整对象然后删除该项，然后再次将对象设置回本地存储？

到目前为止，我最接近直接删除任何内容的是..

localStorage.removeItem('favourites');

但这当然会移除整个对象。

【问题讨论】：

localStorage 中只能存储字符串，不能存储对象。因此，您唯一的选择是将整个字符串加载到内存中，对其进行操作，然后将其保存回来。正如@epascarello 所展示的那样，JSON 方法非常适合这一点。

标签： javascript jquery json local-storage

【解决方案1】：

你只有一个键，你的行为就像有多个键

var obj = {
    "id3333":{
        "URL":"somewhere.comm/page1/",
        "TITLE":"Page 1 Title",
    },
    "id4444":{
        "URL":"somewhere.comm/page2/",
        "TITLE":"Page 2 Title",
    }
};

window.localStorage.favs = JSON.stringify(obj);  //store object to local storage
console.log("before : ", window.localStorage.favs);  //display it
var favs = JSON.parse(window.localStorage.favs || {});  //read and convert to object
var delKey = "id3333";  //key to remove
if (favs[delKey]) {  //check if key exists
    delete favs[delKey];  //remove the key from object
}
window.localStorage.favs = JSON.stringify(favs);  //save it back
console.log("after : ", window.localStorage.favs);  //display object with item removed

【讨论】：

有什么理由检查密钥是否存在？如果没有，则不会抛出错误。
只是个人喜好。
感谢 epascarello。您回答了我的“我是否需要检索完整对象”，向我展示了如何定位要删除的键并将该键名称基于变量。
我的术语很糟糕。 id3333 会是一个键，而 URL 是该键中的一个键吗？
@HastigZusammenstellen 是的。一个键/值对可以有另一个键/值对作为它的值。您可以将内部称为“子键”。

【解决方案2】：

使用localStorage.removeItem，您只能删除顶级键，即直接在localStorage 上的键。

因为id3333 位于localStorage.favourites，所以您无法使用localStorage.removeItem 将其删除。

试试delete localStorage.favourties['id3333']

【讨论】：

【解决方案3】：

实际上很简单：您只需 delete 它。 :)

x = {
    "id3333":{
        "URL":"somewhere.comm/page1/",
        "TITLE":"Page 1 Title",
    },
    "id4444":{
        "URL":"somewhere.comm/page2/",
        "TITLE":"Page 2 Title",
    }
};
console.log(x);
delete x.id3333;
console.log(x);

delete 可以满足您的需求。如果你愿意的话，你也可以做类似delete x.id3333.TITLE 的事情。另请注意，delete 如果成功则返回 true，否则返回 false。

【讨论】：

嗨，鲍勃，感谢您的回复。 delete x.id3333.TITLE 很高兴知道，我会发现这种在键中定位键的方式的用途:)
不客气。我必须自己尝试一下，所以我也很高兴知道。

【解决方案4】：

假设你像这样在 localStorage 中设置一个嵌套对象

const dataObj = {
    uid: {
        name: 'robin',
        age: 24,
    }

} 

window.localStorage.setItem('users', JSON.stringify(dataObj));

现在您要删除 age 属性。您不能使用 removeItem 本机函数将其删除，因为它允许从顶层删除。

所以你需要先获取数据并删除你想要的属性，然后再次将数据设置为 localStorage 并更新值

const existingLocalStorage = JSON.parse(window.localStorage.getItem('users') || {});
if(existingLocalStorage['uid']['age']) { // if throws any error, use lodash get fucntion for getting value
    delete existingLocalStorage['uid']['age'];
}
window.localStorage.setItem('users', JSON.stringify(existingLocalStorage));

【讨论】：