sessionStorage是仅在当前标签页生命周期内有效的前端存储机制；关闭标签页即清空数据，同源多标签页间不共享，适用于临时状态如表单草稿，API与localStorage一致但作用域不同。
会话存储（sessionStorage）是浏览器提供的、仅在当前标签页生命周期内有效的键值对存储机制；关闭该标签页（或窗口）后，所有数据自动清空。它和 localStorage 接口几乎完全一致，但数据寿命和作用域完全不同——这是唯一真正需要你记住的区别。
为什么关掉页面就丢了？——看懂 sessionStorage 的作用域规则
它不是“按时间”失效，而是“按会话”绑定：只要标签页没关闭，哪怕刷新、跳转、前进后退，数据都还在；一旦关闭该标签页（哪怕只是 Ctrl+W），整个 sessionStorage 就被浏览器彻底销毁。
- 同源的多个标签页之间互不共享
sessionStorage，哪怕 URL 完全一样 - 同一标签页内的 iframe（同源）可以共享父页的
sessionStorage - 新开的标签页（即使地址相同）拥有独立的
sessionStorage实例 - 不支持跨域，也不随 HTTP 请求发送，纯前端隔离
setItem / getItem 写法一样，但存错地方就白干
两者 API 完全一致，所以新手常误以为“换行改个名就能长期保存”，结果上线后发现用户填一半表单关了页面，再打开啥都没了——因为用了 sessionStorage 而非 localStorage。
sessionStorage.setItem('draft', JSON.stringify({ name: '张三', email: 'zhang@example.com' }));
// 刷新后仍可读
const draft = JSON.parse(sessionStorage.getItem('draft') || '{}');
// 但关掉这个标签页，上面这行就会返回 null
- 必须手动
JSON.stringify()存对象，getItem()返回的是字符串，直接用会报错 - 永远检查
getItem()返回是否为null，否则JSON.parse(null)抛TypeError - 别指望它替代后端持久化——它连页面刷新都不保证（极端情况如崩溃恢复可能丢失）
选 sessionStorage 还是 localStorage？看这三个判断点
不是“哪个更新潮”，而是“谁更守规矩”：
立即学习“Java免费学习笔记（深入）”；
- 要跨页面保留（比如主题色、语言偏好、登录 token）→ 用
localStorage - 只在当前流程中暂存（比如多步表单中间状态、临时筛选条件、未提交的草稿）→ 用
sessionStorage - 涉及敏感操作（如二次验证环节的临时凭证），且不希望用户换标签页还能复用 →
sessionStorage更安全（比localStorage多一层天然隔离）
注意：两者容量通常都是 5–10MB，IE9+ 兼容，但 Safari 在无痕模式下可能直接禁用 sessionStorage（返回 QuotaExceededError），这点容易被忽略。
