localStorage和sessionStorage是浏览器提供的键值对存储机制，前者长期有效，后者仅限当前标签页；均需用JSON.stringify/parse处理对象，且须try-catch应对容量超限或禁用情况。
和sessionStorage是浏览器提供的键值对存储机制，前者长期有效，后者仅限当前标签页；均需用JSON.stringify/parse处理对象，且须try-catch应对容量超限或禁用情况。localStorage 和 sessionStorage 是浏览器提供的两种客户端存储机制，都以键值对（字符串）形式保存数据，操作简单、无需后端参与，适合存用户偏好、临时状态等轻量信息。
基本用法：增删查改四步到位
两者 API 完全一致，核心方法就四个：
-
设置值：
localStorage.setItem('key', 'value')或sessionStorage.setItem('key', 'value') -
读取值：
localStorage.getItem('key')返回字符串，不存在时返回null -
删除单个：
localStorage.removeItem('key') -
清空全部：
localStorage.clear()（慎用）
关键区别：生命周期和作用域
localStorage 数据长期存在，关闭标签页、重启浏览器都不丢失，除非手动清除或代码调用 clear()；sessionStorage 只在当前标签页（tab）生命周期内有效，关闭该 tab 就自动清空，新开同地址的 tab 也是独立的。
两者都遵循同源策略：只有协议、域名、端口完全相同，才能互相访问数据。
存对象？记得先转成 JSON 字符串
它们只能存字符串，直接存对象会变成 [object Object]：
- ✅ 正确写法：
localStorage.setItem('user', JSON.stringify({name: '张三', age: 25})) - ✅ 读取还原：
JSON.parse(localStorage.getItem('user')) - ❌ 错误写法：
localStorage.setItem('user', {name: '张三'})（存进去的是字符串[object Object]）
注意异常：超出容量或禁用时要兜底
大多数浏览器限制约 5–10MB，超限会抛出 QuotaExceededError；用户也可能禁用存储。建议加 try-catch：
try {
localStorage.setItem('theme', 'dark');
} catch (e) {
console.warn('本地存储不可用，降级处理');
// 比如用内存变量暂存，或提示用户
}
