Html5 localStorage存储对象

terry 2年前 (2023-09-07) 阅读数 330 #Html5

文章标签 JavaScript

前言

今天想知道localStorage是否可以存储对象，所以看了一些文章。

结果：对象无法存储

工作解决方案

再看Apple、Mozilla和Mozilla的官方文档，localStorage的功能仅限于处理字符串键/值对。

如果我们想要存储对象该怎么办？

解决方案

我们可以在存储对象之前对其进行表征，然后在需要使用时对其进行分析。

参考代码是

/**
 * 日期：2019年8月13日
 * 前端演示：https://codeqd.com/zb_users/upload/2023/09/
 */

var testObject = { '一': 1, '二': 2, '三': 3 };

// 存储一个对象
localStorage.setItem('testObject', JSON.stringify(testObject));

// 从localStorage获取对象
varretrieveObject = localStorage.getItem('testObject');

console.log('retrievedObject:', JSON.parse(retrievedObject));

您可以看到我通过 JSON.stringify 和 JSON.parse 方法实现了将对象存储在 localStorage 存储中的技巧。