JavaScript中原始类型数据在LocalStorage存储规范-js教程-PHP中文网

localstorage只支持字符串键值对，原始类型必须用json.stringify()序列化、json.parse()反序列化，并用try...catch处理解析异常，避免隐式转换和undefined直接存储。

javascript中原始类型数据在localstorage存储规范

JavaScript原始类型（如字符串、数字、布尔值、null、undefined）存入 localStorage 时，必须转为字符串，因为 localStorage 只支持字符串键值对。这是最核心的规范，所有操作都围绕它展开。

原始类型必须显式序列化

localStorage.setItem(key, value) 的 value 参数会被自动调用 .toString()，但行为不统一，容易出错：

字符串：直接存储，无问题
数字：如 42 → "42"，可接受；但 NaN → "NaN"，Infinity → "Infinity"，恢复后不是原始值
布尔值：true → "true"，false → "false"，看似合理，但取回时仍是字符串，需手动转换
null：→ "null"，和字符串 "null" 无法区分
undefined：→ "undefined"，同上，语义丢失

✅ 正确做法：统一使用 JSON.stringify() 序列化，确保可逆且语义明确。

读取时必须反序列化并校验

localStorage.getItem(key) 返回的是字符串，即使你存的是数字或布尔值。不能直接使用，需解析并处理异常：

javascript-pro

专注现代 ECMAScript、异步编程、性能优化和全栈的 JavaScript 专家，适用于现代开发

下载

用 JSON.parse() 解析，而非依赖隐式转换（如 +str 或 Boolean(str)）
必须包裹 try...catch，因为数据可能被手动篡改或损坏
对 null 和 undefined 要特殊处理：它们经 JSON.stringify() 后分别是 "null" 和 "undefined" 字符串，但后者 JSON.parse("undefined") 会报错，所以建议避免存 undefined

示例安全读取：

function getStoredValue(key) {
  const str = localStorage.getItem(key);
  if (str === null) return undefined;
  try {
    return JSON.parse(str);
  } catch (e) {
    console.warn(`Invalid JSON in localStorage[${key}]:`, str);
    return undefined;
  }
}