使用JavaScript获取localStorage中JSON的productTitle为undefined如何解决

问题原因 #

你调用JSON.stringify()存储数据时，传入的参数是外层包裹了方括号的数组[{...}]，因此读取后通过JSON.parse()解析得到的productdata是数组类型，不是对象类型，直接使用.productTitle访问对象属性的语法无法命中值，因此返回undefined。

解决方案 #

方案1：不修改存储逻辑，调整读取代码 #

直接访问解析后数组的第0位元素（即你存入的商品对象）再读取属性即可：

let productdata = JSON.parse(localStorage.getItem('orderproduct'));
console.log("The product title is"+ productdata[0].productTitle);

方案2：调整存储逻辑，适配现有读取代码 #

如果你只会存储单个商品，可在存储时去掉外层的数组包裹，后续读取的逻辑无需改动：

localStorage.setItem('orderproduct', JSON.stringify({imageSource: productImg, productTitle: title, productQuantity: qty, productPrice: finalprice}));

内容的提问来源于stack exchange，提问作者Kaichun Yau