Html5 localStorage存储对象

前言

今天俺比较好奇localStorage是否可以存储对象，因此查阅了一些文章。

结果是：不可以存储对象

工作解决方案

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

如果我们想要存储对象应该怎么处理呢？

解决方法

我们可以在存储对象之前对其进行字符串化，然后在需要使用对象时对其进行解析。

参考代码如下：

/**
 * 时间：2019年8月13日
 * 前端教程： https://www.pipipi.net/
 */

var testObject = { 'one': 1, 'two': 2, 'three': 3 };

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

// 从localStorage取一个对象
var retrievedObject = localStorage.getItem('testObject');

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

可以看到俺通过JSON.stringify和JSON.parse方法实现了localStorage存储对象的小技巧。