localStorage长期存储、跨会话共享，sessionStorage仅限当前标签页会话；二者均同源隔离、仅存字符串、API相同，但生命周期与作用域不同。
JavaScript 中的 localStorage 和 sessionStorage 都是浏览器提供的 Web Storage API，用于在客户端存储键值对数据，但它们的生命周期、作用域和使用场景有本质区别。
localStorage：长期保存，跨会话可用
数据一旦写入，会一直保留在浏览器中，除非被代码主动删除或用户手动清除缓存。它不随页面关闭、标签页关闭或浏览器重启而消失，适合存储需要持久化的内容，比如用户偏好设置、主题选择、登录态标识（注意：敏感信息如 token 不建议明文存这里）。
作用域为同源（协议 + 域名 + 端口），同一域名下所有页面共享同一个 localStorage 容量通常为 5–10 MB（不同浏览器略有差异） 只能存储字符串，存对象需先 JSON.stringify()，读取时用 JSON.parse()
sessionStorage：仅限当前会话，页面级隔离
数据只在当前浏览器标签页（或窗口）的会话周期内有效。关闭该标签页后，数据自动清空；新开一个相同 URL 的标签页，也会拥有独立的 sessionStorage。适合临时状态管理，比如表单草稿、导航参数、多步骤流程中的中间数据。
即使同源，不同标签页之间互不共享 sessionStorage 容量与 localStorage 相当，也受浏览器限制 同样只支持字符串，对象需序列化/反序列化
基本操作方式完全一致
两者 API 完全相同，都提供 setItem(key, value)、getItem(key)、removeItem(key) 和 clear() 方法：
立即学习“Java免费学习笔记（深入）”；
// 存储localStorage.setItem('theme', 'dark');sessionStorage.setItem('formDraft', JSON.stringify({ name: 'Alice', email: 'a@b.c' }));// 读取const theme = localStorage.getItem('theme'); // 'dark'const draft = JSON.parse(sessionStorage.getItem('formDraft')); // { name: 'Alice', ... }// 删除localStorage.removeItem('theme');sessionStorage.clear(); // 清空当前会话所有数据
安全与使用提醒
两者都运行在前端，数据可被用户直接查看和修改，绝不能用于存储密码、token、银行卡号等敏感信息。若需临时存 token，优先考虑 httpOnly Cookie；若必须用 Storage，请配合后端校验与短期有效期控制。
另外，Storage 是同步阻塞操作，在大量数据读写时可能影响主线程性能，高频场景建议节流或改用 IndexedDB。
以上就是javascript如何存储数据_localstorage和sessionstorage有何区别的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1544032.html
微信扫一扫 
支付宝扫一扫 
