localStorage只能存字符串，非字符串需用JSON.stringify()序列化、JSON.parse()解析，且取值后须判空并try-catch，作用域为同协议域名端口，不自动跨标签页同步。
localStorage 只能存字符串，所有非字符串类型必须手动序列化和解析，这是绝大多数初学者踩坑的根源。
localStorage.setItem() 必须传两个字符串参数
第一个是键名（key），第二个是值（value），且 value 会被自动转成字符串——这意味着直接存对象或数组会变成 "[object Object]" 或 "1,2,3"，数据已丢失。
- ✅ 正确做法：用
JSON.stringify()手动序列化 - ❌ 错误写法：
localStorage.setItem('user', {name: 'Alice'}) - ✅ 正确写法：
localStorage.setItem('user', JSON.stringify({name: 'Alice'}))
localStorage.getItem() 返回的是字符串，不是原始类型
即使你存的是数字 42，取出来也是字符串 "42"；存的是对象，取出来是 JSON 字符串，不解析就无法当对象用。
- 取值后务必判断是否为
null（键不存在时返回null，不是undefined） - 对象/数组类数据必须用
JSON.parse()解析，且需包裹try...catch防止解析失败崩溃 - 数字建议显式转换：
const count = Number(localStorage.getItem('count'))
存取值时注意作用域和有效期
localStorage 是协议 + 域名 + 端口三级作用域，http://a.com 和 https://a.com 互不可见；同源下所有标签页共享，但不同浏览器或无痕窗口完全隔离。
立即学习“前端免费学习笔记（深入）”；
- 不能跨协议、跨子域读写（
https://a.com写的，http://a.com读不到） - 没有过期时间，除非手动调用
localStorage.removeItem()或localStorage.clear() - 存储上限通常为 5MB 左右，超限会抛出
QuotaExceededError
const user = { name: 'Alice', age: 28 };
localStorage.setItem('user', JSON.stringify(user));
const saved = localStorage.getItem('user');
if (saved) {
try {
const parsed = JSON.parse(saved);
console.log(parsed.name); // 'Alice'
} catch (e) {
console.error('JSON parse failed:', e);
}
} else {
console.log('Key "user" not found');
}
最常被忽略的一点：localStorage 不触发跨标签页事件监听——一个标签页改了值，其他同源标签页不会自动感知，需要自己用 storage 事件监听并手动同步状态。
