17370845950

localStorage 是浏览器提供的持久化键值对存储机制，数据永久保存、同源共享、仅支持字符串、容量5–10MB；常用方法包括 setItem、getItem、removeItem 和 clear；适用于用户偏好等非敏感场景，禁存密码等敏感信息。

localStorage 是浏览器提供的一种简单、持久的客户端数据存储机制，允许网页在用户设备上保存键值对格式的数据，即使关闭浏览器或重启电脑，数据也不会丢失。

localStorage 的核心特点

它属于 Web Storage API 的一部分，和 sessionStorage 并列，但关键区别在于生命周期：

• 数据永久保存（除非手动清除或代码删除）
• 同一域名下所有页面共享同一份 localStorage
• 只支持字符串类型——存对象或数组需先用 JSON.stringify() 转换，读取时用 JSON.parse() 还原
• 容量通常为 5–10MB（因浏览器而异），远大于 Cookie

基本操作方法

使用起来非常直接，主要靠四个方法：

• setItem(key, value)：保存数据，例如 localStorage.setItem('theme', 'dark')
• getItem(key)：读取数据，例如 const theme = localStorage.getItem('theme')
• removeItem(key)：删除某一项，例如 localStorage.removeItem('token')
• clear()：清空当前域名下所有 localStorage 数据

常见使用场景与注意事项

适合存用户偏好（如主题、语言）、表单草稿、登录态标识（如 token，但注意安全性）、离线缓存等轻量级状态。

注意：不要存敏感信息（如密码、银行卡号），因为 localStorage 可被任意同源 JavaScript 读取，也不受 HTTPS 保护；涉及认证建议配合后端 session 或 httpOnly Cookie 使用。

另外，首次访问时 getItem 可能返回 null，记得做空值判断，避免 JSON.parse(null) 报错。