页面加载时从localStorage读取"compareList"并安全解析为数组，添加商品时按id去重、前置插入、更新timestamp并限制总数不超过6条，修改后重新写入localStorage并同步UI。
可以在页面加载时读取 localStorage 中的对比商品列表，添加商品时检查是否已存在、限制数量并更新时间戳，再存回 localStorage。
初始化：页面加载时读取对比记录
用户打开页面时，从 localStorage 读取已保存的对比商品数组。建议用 JSON.parse 安全解析，并处理可能的异常（如数据损坏或为空）：
- 使用键名如 "compareList" 统一标识对比记录
- 若解析失败或值为 null，初始化为空数组
[] - 可按 timestamp 字段倒序排列，确保最新添加的在前
添加商品：去重 + 限时长 + 限数量
点击“加入对比”时，不直接 push，而是先校验逻辑：
- 用商品 id（推荐用 skuId 或 productId）判断是否已存在，避免重复
- 若已存在，将其移到数组开头，并更新 timestamp（如
Date.now()） - 若未存在，前置插入新商品对象（含 id、name、price、imgUrl、timestamp 等必要字段）
- 控制总数不超过 4～6 条（电商常见上限），超出则
.pop()移除最久的一条
存储与同步：安全写入 + 页面响应
每次修改后需及时写回 localStorage，并同步更新 UI：
立即学习“前端免费学习笔记（深入）”；
- 用
localStorage.setItem("compareList", JSON.stringify(list))保存 - 捕获 QuotaExceededError 异常（如存储超限），提示用户清理或忽略本次操作
- 同时触发页面上的对比栏重新渲染（例如显示商品缩略图、价格和“移除”按钮）
- 可监听 storage 事件，在其他同源标签页中自动更新对比状态
清理与扩展：支持手动移除与过期策略
用户可能需要删除某条记录，或系统自动清理陈旧数据：
- 提供“移除”按钮，点击后过滤数组并重新保存
- 可选增加过期机制：例如只保留最近 7 天内的记录（对比 timestamp 和当前时间）
- 如需跨设备同步，localStorage 不适用，应改用后端接口 + 用户登录态
