Web Storage只接受字符串，数字、布尔、对象等需序列化；对象数组必须用JSON.stringify()存、JSON.parse()取并加兜底；Date/Map/Set/RegExp等需手动处理；建议封装set/get函数或使用web-storage-cache类库。
Web Storage（包括 localStorage 和 sessionStorage）只接受字符串作为值，这是硬性限制。哪怕你传入数字、布尔、对象、数组甚至 null，底层都会自动调用 .toString()，结果不是丢失数据就是变成无意义的 [object Object] 或 undefined。所以“类型转换”和“序列化”不是可选项，而是必经步骤。
基础字符串存取无需转换
纯字符串直接使用即可，不涉及 JSON：
-
✅ 正确：
localStorage.setItem('theme', 'dark') -
✅ 正确：
sessionStorage.setItem('token', 'abc123xyz') -
❌ 错误：
localStorage.setItem('count', 42)→ 取出是字符串"42"，虽能转回数字，但语义已丢失，且易引发隐式类型错误
对象与数组必须 JSON 序列化
这是最常见也最容易出错的一环。关键不是“能不能”，而是“怎么写得安全”：
- 存时统一用
JSON.stringify()，避免直接传对象 - 取时必须加兜底：用
JSON.parse(localStorage.getItem('key') || '[]')或JSON.parse(localStorage.getItem('key') || '{}')，防止null导致解析报错 - 建议包裹
try...catch，尤其在读取不可控数据（如用户手动修改 localStorage）时 - 示例：
localStorage.setItem('cart', JSON.stringify([{id:1,qty:2},{id:3,qty:1}]))；读取：const cart = JSON.parse(localStorage.getItem('cart') || '[]');
处理不可序列化的类型（Date/Map/Set/RegExp）
原生 JSON.stringify() 会丢弃 Date 的实例、跳过 function 和 undefined、把 Map 和 Set 变成空对象或空数组。需主动干预：
-
Date：存前转 ISO 字符串，
new Date().toISOString()；读取后用new Date(str)还原 -
Map：存前用
Object.fromEntries(map)，读取后用new Map(Object.entries(obj)) -
Set：存前用
Array.from(set)，读取后用new Set(arr) -
RegExp：存前用
reg.toString()（如/test/gi），读取后用new RegExp(str)
简化操作：封装一个安全的 storage 工具
重复写 JSON.stringify 和 try/catch + JSON.parse 容易遗漏。可封装两个函数降低出错概率：
-
set(key, value)：自动判断类型，对对象/数组执行 stringify，其他类型直接存（字符串、数字、布尔等） -
get(key, defaultValue = null)：尝试 parse，失败则返回默认值，不抛错 - 进阶可引入
web-storage-cache类库，它内置类型自动识别、过期控制和内存缓存层，适合中大型项目
