对象属性在 localStorage 之后未定义

Question

我在 localStorage 中存储了一堆值。具体来说，其中包含 JSON 个对象的数组。当我想向该数组添加另一个对象时，我是这样拉它、解析它、推入数组并再次设置它的。

var clickedItem = sessionStorage.getItem('location'),
interest = [],
interests = localStorage.getItem('interests');
interestsParsed = JSON.parse(interests);
interestsParsed.push(clickedItem);
localStorage.setItem('interests', JSON.stringify(interestsParsed));

稍后，如果我拉取数组并循环遍历数组，我的属性是未定义的。

var data = JSON.parse(localStorage.getItem('interests'));

for(var i = 0, j = data.length; i < j; i++ ){
    console.log(data[i].anything); // any property is undefined
}

PS。 JSON 对象在我对其进行控制台时看起来完全正常。知道为什么 props 会是未定义的吗？

更新： 数据实际上是一个数组，循环遍历它确实为我提供了其中的每个值。但是，数组中的每个 JSON 对象不再是对象，并且必须是 JSON.parsed 到 "recreate" 字符串之外的对象。

关于在 localStorage 的数组中存储 JSON 个对象，这是一个非常好的课程。

var data = JSON.parse(localStorage.getItem('interests'));

for(var i = 0, j = data.length; i < j; i++ ){
    console.log(data[i].anything); // any property is undefined
    var obj = JSON.parse(data[i]); // parse it instead
    console.log(obj.title); // use it as an object now
}

Answer 1

JSON.parse() returns 一个 object 但你把它当作一个 array。不是推送到数组，而是向对象添加一个新项。

Answer 2

我的假设是您正在尝试 stringify 一个复杂的对象，可能类似于 DOM 对象或另一个内置 API 的对象。发生的事情是 JSON.stringify 将从所有方法中剥离对象，这包括内部 setter 和 getter，而您仍然是一个空的（或几乎是空的）对象。

在这种情况下，我的解决方案是将复杂的对象解析为一个简单的对象，其中只包含您选择的格式所需的属性。

Answer 3

localStorage 只支持字符串。使用 JSON.stringify() 和 JSON.parse()。

//demo value
var clickedItem = {"testValue":111};
var interests = [{'a':1},{'b':2},{'c':4}];
localStorage.setItem('interests', JSON.stringify(interests));
//demo value end
interest = [],
interests = localStorage.getItem('interests');

interestsParsed = JSON.parse(interests);
interestsParsed.push(clickedItem);
console.log(interestsParsed);
localStorage.setItem('interests', JSON.stringify(interestsParsed));

var data = JSON.parse(localStorage.getItem('interests'));

for(var i = 0, j = data.length; i < j; i++ ){
   console.log(data[i]);
}

我认为你没有将兴趣的价值字符串化，（在第 3 行获得价值之前）

对象属性在 localStorage 之后未定义

Object properties are undefined after localStorage

javascript

undefined

local-storage

javascript-objects