javascript - 将对象属性与 JavaScript 中本地存储中的变量进行比较

Question

是否可以使用 Javascript 或 Jquery 将对象属性与存储在本地存储中的变量进行比较？这就是我的意思...

所以我有一个这样的对象:

var persons = [
  {
    "firstName": "Dwight",
    "surName": "Stender",
    "picture": "https://randomuser.me/api/portraits/med/men/99.jpg",
    "id": "1"
  }
]

并且我在本地存储中存储了一个变量(名称为 clickId)。现在我想将对象的 id 与 localstorge 中的那个变量进行比较。我可以将它们都打印到控制台，所以我知道它们有效。但是当我尝试比较它们时，它突然不再起作用了(即使 id 和变量包含相同的数字)。这就是我比较两者的方式:

for (i = 0; i < persons.length; i++) {
    if (persons[i].id == localStorage.clickId) {
        document.getElementById("result").innerHTML = "yay"
    } else {
        document.getElementById("result").innerHTML = "nay"
    };
};

注意 1 我也尝试用 === 而不是 ==

比较两者

注意 2 if...else 中要执行的语句只是为了解释目的的占位符

Answer 1

您需要使用 localStorage.getItem(key) 来检索您之前存储的对象。另请注意，由于 localStorage 只能保存字符串，因此您需要在保存之前/之后序列化该对象。 JSON 将是理想的选择:

另请注意，您可以使用 some() 来否定 for 循环，并使用三元来简化 if。

var persons = [{
  "firstName": "Dwight",
  "surName": "Stender",
  "picture": "https://randomuser.me/api/portraits/med/men/99.jpg",
  "id": "1"
}];

var person = JSON.parse(localStorage.getItem('person') || '{}');
document.getElementById("result").innerHTML = persons.some(p => p.id == person.clickId) ? "yay" : 'nay';

localStorage.setItem('person', JSON.stringify({
  clickId: 1
}));

<div id="result"></div>

Working example