localStorage操作对象数组-创新互联

localStorage操作对象数组

• • • • • • 原因
          • 直接放结论
          • 分析

创新互联公司是一家集网站建设,漠河企业网站建设,漠河品牌网站建设,网站定制,漠河网站建设报价,网络营销,网络优化,漠河网站推广为一体的创新建站企业，帮助传统企业提升企业形象加强企业竞争力。可充分满足这一群体相比中小企业更为丰富、高端、多元的互联网需求。同时我们时刻保持专业、时尚、前沿，时刻以成就客户成长自我，坚持不断学习、思考、沉淀、净化自己，让我们为更多的企业打造出实用型网站。原因

之前想把数据直接存储到localStorage中，直接setItem后getItem就好了，但是在存储对象数组的时候发现数据会变成object [Object]。

直接放结论

let data = {name: "张三",
        age: 18,
        hobby: ["吃饭", "睡觉"]
    }
    console.log("原始值", data);
    localStorage.setItem("data", JSON.stringify(data));
    let localData = JSON.parse(localStorage.getItem("data"));
    console.log("处理后的值", localData);

输出的结果前后一致

分析

如果直接输出：

let data = {name: "张三",
        age: 18,
        hobby: ["吃饭", "睡觉"]
    }
    console.log("原始值", data)
    localStorage.setItem("data", data);
    let localData = localStorage.getItem("data");
    console.log("处理后的值", localData);

data会自动执行toString()方法，导致最后结果不同。

JSON.stringify()：将js转换成json字符串
JSON.parse()：将json字符串抓换成js对象

你是否还在寻找稳定的海外服务器提供商？创新互联www.cdcxhl.cn海外机房具备T级流量清洗系统配攻击溯源，准确流量调度确保服务器高可用性，企业级服务器适合批量采购，新人活动首月15元起，快前往官网查看详情吧

文章标题：localStorage操作对象数组-创新互联
链接地址：http://cdxtjz.cn/article/dcpdjs.html