removeitem()仅删除完全匹配的单个key，大小写敏感且静默失败；clear()清空当前origin全部数据，不可逆；批量删需遍历object.keys()配合startswith()实现。
removeItem() 只删一个 key，大小写敏感且静默失败
removeItem() 的作用非常明确：只删除 localStorage 中完全匹配指定字符串的单个键值对。它不支持通配符、前缀匹配或正则，传入不存在的 key 也不会报错，只是返回 undefined，容易让人误以为“删成功了”。
常见错误现象包括：
- 调用
localStorage.removeItem('user_')想批量删所有以user_开头的项 → 实际什么都没删 - 传入变量但变量为空或拼写错误（如
localStorage.removeItem(userToken)未加引号）→ 静默失效 - 在 iframe 或 Service Worker 中调用 → 触发
SecurityError，因同源策略限制
使用时务必确认 key 名完全一致（含大小写），例如用户登出时清理 token：
localStorage.removeItem('auth_token');
若不确定 key 是否存在，可先用 localStorage.getItem('auth_token') !== null 判断，再决定是否调用 removeItem()。
clear() 是“核按钮”，清空当前 origin 全部数据
clear() 不接受任何参数，执行后会同步删除当前协议+域名+端口（即 origin）下 localStorage 的所有键值对，不可逆，也不通知其他标签页。
生产环境里应避免无条件调用，尤其不能放在初始化逻辑或自动脚本中。典型误用场景：
- 上线代码里写了
localStorage.clear()→ 用户所有本地偏好、草稿、主题设置全丢 - 在跨子域页面（如
app.example.com和api.example.com）误以为能共享清除 → 实际各清各的，且可能因权限被拒 - 想清
sessionStorage却写了localStorage.clear()→ 完全没影响
它适合的场景极少，仅限用户主动点击“重置所有设置”或调试时手动清理。执行后务必用 DevTools 的 Application → Storage 面板验证是否真清空——别信控制台返回的 undefined。
按前缀批量删？得自己遍历 Object.keys()
Web Storage 标准没提供 removeByPrefix() 这类方法，要删所有 cart_ 开头的项，只能手动遍历判断。
正确做法是结合 Object.keys() 和 String.prototype.startsWith()：
Object.keys(localStorage).forEach(key => {
if (key.startsWith('cart_')) {
localStorage.removeItem(key);
}
});
注意几点：
- 遍历本身是同步的，但大量 key（如 >1000）时会有轻微性能开销，不过一般业务无感
- 不要在遍历中直接修改数组长度（比如用
for...in+delete），Object.keys()返回的是快照，安全 - 建议封装成复用函数，例如：
function removeByPrefix(prefix) { ... }，避免重复写逻辑
别试图用 for (let i = 0; i 配合 <code>localStorage.key(i) —— 虽然可行，但不如 Object.keys() 直观且易读。
clear() 和 removeItem() 都不管 IndexedDB、Cache API、Service Worker
很多人以为 localStorage.clear() 就等于“清空浏览器所有本地缓存”，这是最大误区。它只影响 localStorage，对以下存储完全无效：
-
IndexedDB：需显式调用indexedDB.deleteDatabase('db_name') -
Cache API（如 Service Worker 缓存）：得用caches.delete('cache_name') -
sessionStorage：要用sessionStorage.clear()，和localStorage互不影响 - HTTP 缓存、磁盘缓存：JS 无法直接清除，只能靠
location.reload(true)或服务端设置响应头
真正要“彻底清理”，必须按存储类型逐项处理。比如用户登出时，除了 localStorage.removeItem('token')，还应检查是否注册了 Service Worker 并调用 navigator.serviceWorker.getRegistrations().then(r => r.forEach(reg => reg.unregister()))，否则缓存可能继续生效。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
