localStorage 数据永久存在且同域共享，sessionStorage 仅限当前标签页会话、关闭即销毁且多标签页间隔离；二者均需用 JSON.stringify/parse 处理对象。
localStorage 和 sessionStorage 的生命周期到底差在哪
根本 区别 就一条：localStorage 数据永久存在，除非手动清除；sessionStorage 数据只在当前 浏览器 标签页（或窗口）存活，关掉就没了。这不是“差不多”，而是底层设计逻辑完全不同——前者绑定到域名，后者绑定到页面会话。
关闭浏览器后，sessionStorage 真的全丢了？
是的，但要注意“关闭”的定义：sessionStorage 在以下情况会被清空：
- 用户手动关闭该标签页（或整个窗口）
- 调用
window.close()关闭当前窗口（且该窗口由window.open()打开） - 浏览器崩溃重启（大多数现代浏览器会保留 tab 会话，但
sessionStorage不在此列） - 隐私模式下新开标签页，即使同一域名，
sessionStorage也是全新隔离的
特别注意：刷新页面、前进 / 后退、甚至页面内 location.reload() 都不会影响 sessionStorage —— 它只认“会话结束”这个硬边界。
同域下多个标签页之间，localStorage 能共享，sessionStorage 不能
这是最常踩坑的点。比如你开了两个 tab 访问 https://example.com/a.html 和 https://example.com/b.html：
立即学习 “ 前端免费学习笔记（深入）”；
-
localStorage.setItem('user', 'alice')在 A 标签页执行 → B 标签页立刻能localStorage.getItem('user')读到'alice' -
sessionStorage.setItem('temp', '123')在 A 标签页执行 → B 标签页读sessionStorage.getItem('temp')返回null，完全无感知
这种隔离性让 sessionStorage 天然适合存临时表单草稿、页面级 token、导航状态等“不跨页”的数据；而 localStorage 更适合用户偏好、登录态（需配合有效期校验）、离线缓存等跨会话场景。
都用 setItem 存对象，为什么 JSON.stringify 是必选项
因为 localStorage 和 sessionStorage 只接受字符串作为值。直接传对象会触发 .toString()，结果全是 [object Object]：
localStorage.setItem('data', { name: 'Tom'}); console.log(localStorage.getItem('data')); // "[object Object]"正确做法始终是：
- 存：用
JSON.stringify()序列化 - 取：用
JSON.parse()反序列化，并加try/catch防止损坏数据导致解析失败
示例：
try {const obj = { id: 1, name: 'Tom'}; localStorage.setItem('user', JSON.stringify(obj)); const stored = JSON.parse(localStorage.getItem('user')); } catch (e) {console.error('JSON parse failed:', e); }别省这一步，否则某天 getItem 返回字符串却当对象用，undefined 错误会出现在最意想不到的地方。
