localStorage不支持自动过期，必须手动封装setWithExpiry/getWithExpiry：存时序列化含expiresAt的对象，取时解析、校验、过期即删，并用try/catch容错坏数据。
localStorage 本身不支持过期时间，所有数据默认永久存在。你必须自己加时间戳逻辑，否则缓存会一直残留，甚至引发安全或数据陈旧问题。
为什么不能直接用 localStorage.setItem 存带过期时间的值？
因为 localStorage.setItem 只接受字符串作为 value；如果你传对象或数字，它会自动调用 toString()，丢失结构和类型。比如存 { value: 'abc', expires: 1714045000000 }，不经过 JSON.stringify 就会变成 [object Object]，读取时 JSON.parse 直接报错。
- 必须用
JSON.stringify序列化后再存 - 读取后必须用
JSON.parse解析，且要try/catch容错（比如用户手动清过部分数据、跨设备写入格式不一致） - 时间字段名要统一，推荐用
expiresAt（明确是到期时间点），别用expiresIn或ttl（容易混淆为剩余毫秒数）
setWithExpiry 和 getWithExpiry 怎么写才靠谱？
这两个函数不是可选的“增强”，而是实际项目里避免重复出错的底线封装。核心就三件事：存时打时间戳、取时校验、过期则删。
将调研报告、方案对比、数据分析、需求梳理、会议纪要、设计说明、代码评审、学习笔记等任务产物输出为可在浏览器直接打开的单文件 HTML，替代 Markdown 作为最终交付物。Markdown 在信息密度、视觉清晰度和可分享性上已跟不上 AI 产物的丰富度，HTML 能同时承载排版、表格、SVG 等。
-
setWithExpiry(key, value, ttlMs)中，ttlMs是毫秒数，计算expiresAt = Date.now() + ttlMs，然后存{ value, expiresAt } -
getWithExpiry(key)必须先检查localStorage.getItem(key)是否为null，再JSON.parse，再判断Date.now() > item.expiresAt - 一旦过期，立刻
localStorage.removeItem(key)，并返回null；不要只返回null却不清理，否则脏数据越积越多
跨标签页时，过期数据为什么还会被读到？
因为 storage 事件只通知“别的窗口改了”，不通知“自己刚写的已经过期”。你在窗口 A 调用 setWithExpiry('token', 'xxx', 60000)，1 分钟后在窗口 A 读 getWithExpiry('token')，它不会自动感知已过期——除非你每次读都走完整校验逻辑。
立即学习“前端免费学习笔记（深入）”；
- 每个
getWithExpiry调用都必须独立完成「取 → 解析 → 判断 → 清理」全流程 - 别依赖
storage事件来同步过期状态，它无法替代主动校验 - 如果页面高频读同一个 key，可加内存缓存（比如
Map存{ value, expiresAt }），但缓存也要在每次读前比对Date.now()，不能省掉时间判断
最常被忽略的一点：过期逻辑必须覆盖解析失败的情况。比如用户用开发者工具手动改了 localStorage 里的某个值，导致 JSON.parse 报错，这时你不 removeItem，这个坏数据就会永远卡在那里，后续任何 getWithExpiry 都会反复报错。所以 catch 块里该删就得删。
