sessionStorage是Web Storage API的一部分，用于在浏览器中以键值对形式临时存储字符串数据，作用域限于当前标签页，关闭页面或浏览器后自动清除。它适合存储表单数据、页面间传参、控制弹窗显示频率及临时缓存接口数据等场景。典型应用包括：1. 多步骤表单中保存用户输入，防止刷新丢失；2. 页面跳转时传递筛选条件或状态信息；3. 标记提示已展示，避免重复显示；4. 缓存不频繁变动的接口数据，减少请求。基本操作有setItem、getItem、removeItem和clear，存储对象需先jsON.stringify转换。合理使用可提升用户体验与性能。
在html5中，sessionStorage 提供了一种在浏览器中临时保存数据的方式，数据仅在当前会话期间有效，关闭页面或浏览器后自动清除。它非常适合用于存储不需要长期保留的临时信息。
什么是sessionStorage？
sessionStorage 是 Web Storage API 的一部分，以键值对的形式存储字符串数据，作用域限定在当前浏览器标签页内。同一域名下的不同页面可以共享 sessionStorage，但新开的标签页是独立的会话。
适合使用sessionStorage的典型场景
以下是一些常见且实用的应用场景：
1. 表单数据临时保存
用户在填写多步骤表单（如注册流程、订单填写）时，若中途刷新页面或跳转，可使用 sessionStorage 保留已输入的内容，提升用户体验。
- 在每一步表单提交前，将数据存入 sessionStorage
- 进入下一步或返回上一步时，读取并填充已有数据
- 流程完成后再清除数据
2. 页面间临时传参
在单页应用或多个页面跳转中，有时需要传递一些非敏感的中间参数（如来源页面标识、临时状态码），sessionStorage 比 URL 参数更简洁安全。
- 从列表页跳转详情页时，存储筛选条件或搜索关键词
- 返回时读取这些条件恢复之前的视图状态
3. 控制弹窗或提示的显示频率
某些一次性提示（如新功能引导、活动提醒），可在当前会话中只显示一次，避免重复打扰。
- 用户关闭提示后，设置标记：sessionStorage.setItem(‘shownGuide’, ‘true’)
- 下次加载检查该标记，若存在则不再显示
4. 临时缓存接口数据
对于变动不频繁的接口数据（如城市列表、配置项），可在当前会话中缓存，减少重复请求。
- 首次请求后将结果存入 sessionStorage
- 后续访问先读缓存，设定合理的过期机制（如时间戳标记）
- 页面关闭后自动释放，不影响下次访问的更新
基本操作方法
使用方式简单直观：
立即学习“前端免费学习笔记（深入）”；
// 存储数据 sessionStorage.setItem('key', 'value'); // 读取数据 const data = sessionStorage.getItem('key'); // 删除数据 sessionStorage.removeItem('key'); // 清除所有 sessionStorage.clear();
注意：存储的值必须是字符串，对象需通过 json.stringify 转换。
基本上就这些。sessionStorage 简单高效，适用于会话级临时数据管理，合理使用能显著提升交互流畅性，又不会污染本地持久存储。