localstorage仅支持字符串键值,所谓嵌套实为json序列化;设计应依数据用途、读写频率与维护成本抉择:平铺适合独立固定配置,单层对象适合关联配置组,避免过度嵌套以防解析失败与体积膨胀,数组类数据宜封装为独立键。

localStorage 本身只支持字符串键和字符串值,所谓“嵌套对象”其实是把 JavaScript 对象序列化成 JSON 字符串再存进去。设计是否平铺、是否嵌套,关键看数据用途、读写频率和维护成本,而不是技术能否实现。
平铺式结构适合简单配置项
当配置项彼此独立、数量固定、增删不频繁时,用扁平键名最直接。比如快捷键设置:
- save → "Ctrl+S"
- undo → "Ctrl+Z"
- fullscreen → "F11"
好处是读取快(不用解析整个对象)、更新轻量(改一个键不影响其他)、调试直观(DevTools 里一眼看清每个值)。
单层对象结构适合关联性强的配置组
像 K 线图的 MA 均线配置,每条均线都有启用状态、颜色、线宽等字段,且周期(5、10、20)天然构成分类维度。这时用一个对象整体存储更合理:
- 键名统一为 ma5、ma10、ma20
- 值为对应配置对象:{"enabled":true,"color":"#2196F3","lineWidth":2}
- 整个结构 {"ma5":{...},"ma10":{...},"ma20":{...}} 一次性存入,用 JSON.stringify() 和 JSON.parse() 处理
避免把每条均线拆成 ma5_enabled、ma5_color 等多个平铺键——既难管理,又增加读写次数。
嵌套过深会带来实际问题
localStorage 不支持原生嵌套,所有“嵌套”都靠 JSON 字符串承载。但过度嵌套会放大风险:
- 单次读取必须完整解析整段 JSON,哪怕只改一个子字段
- 容错变差:某一层缺失或格式错误,整个解析失败
- 体积膨胀:冗余字段、深层路径、重复 key 名都会推高字符串长度
例如,把用户偏好存成 {"profile":{"settings":{"theme":"dark","lang":"zh"}}} 就不如 {"theme":"dark","lang":"zh"} 直接——除非你真有多个 profile 隔离场景。
数组类数据建议封装为独立键
如果要存一组同类对象(如历史操作记录、自定义指标列表),不要强行塞进一个大对象里用数字下标命名(如 history_0、history_1)。推荐:
- 用单一键存整个数组:history → [{"id":"01","action":"zoom","time":1717023456},{"id":"02","action":"pan","time":1717023489}]
- 读取后用 JSON.parse() 得到数组,增删改查用标准数组方法
- 写回前重新 JSON.stringify(),覆盖原键
这样逻辑清晰,也避免因手动拼键名导致索引错乱或遗漏。











