localStorage和sessionStorage仅支持字符串，存对象需JSON序列化，取值前须判空防解析null/undefined报错；更新嵌套数据需读-改-写全量覆盖；sessionStorage随tab关闭清空，localStorage长期持久化；禁存敏感信息，避免高频写入。
JavaScript 本地存储不是数据库，localStorage 和 sessionStorage 只支持字符串——存对象不序列化会变成 [object Object]，取出来直接 undefined。
为什么 JSON.parse() 一用就报错 SyntaxError: Unexpected token u in JSON at position 0
这是最常踩的坑：你试图解析一个 null 或 undefined 值。因为 localStorage.getItem('key') 找不到时返回 null，不是空字符串。
- 必须先判断值是否存在且非空再解析：
const data = localStorage.getItem('user');
const user = data ? JSON.parse(data) : null; - 别在
try...catch里裸包整个解析逻辑——错误可能来自字段缺失或类型错乱，要区分是“没存过”还是“存坏了” -
JSON.stringify()前检查值是否可序列化：函数、undefined、Symbol、循环引用都会被静默丢弃或抛错
如何安全地增删改查带嵌套结构的数据
本地存储没有“更新字段”操作，每次写都是全量覆盖。想改用户头像，不能只塞一个 avatar 字段进去，得先读、再合并、再写回。
- 封装一个
updateStorage(key, partialData)函数，内部自动做getItem→JSON.parse→Object.assign→JSON.stringify→setItem - 删除某个字段？读出对象，用
delete obj.field，再写回；不要用removeItem，那会清空整条记录 - 数组追加元素？别直接
arr.push()后写入——原数组引用没变，得显式赋新数组：const newArr = [...oldArr, newItem]
sessionStorage 和 localStorage 到底该选哪个
区别不在“能不能跨页面”，而在“生命周期策略”。同一个标签页里，两者 API 完全一致，但销毁时机完全不同。
立即学习“Java免费学习笔记（深入）”；
-
sessionStorage：仅限当前浏览器 tab 生命周期。关闭 tab 即清空，刷新保留；适合临时表单草稿、向导步骤状态 -
localStorage：除非手动clear()或用户清除站点数据，否则永久存在；适合用户偏好、登录态 token（⚠️但 token 更推荐httpOnlyCookie） - 注意：iframe 跨域时两者都受同源策略限制，父页和子页不同源就互相读不到
真正难的不是存和取，而是什么时候不该存——比如敏感信息明文塞进 localStorage，等于贴在浏览器控制台门口；再比如高频写入（如滚动位置节流不足），可能触发存储上限或阻塞主线程。这些边界条件，文档从不提醒你。
