localstorage 无法直接 json.stringify 导出，需遍历 key 获取值构造对象再下载为 json 文件；注意处理 undefined/函数、大数据量及中文文件名兼容性问题。
localStorage 数据怎么一键下载成 JSON 文件
直接用 JSON.stringify 把 localStorage 里所有键值对转成字符串，再构造 Blob + URL.createObjectURL 触发下载就行。不用后端、不发请求，纯前端就能搞定。
为什么不能直接用 JSON.stringify(localStorage)
localStorage 是个类数组对象，不是普通 JS 对象，直接 JSON.stringify 会得到空对象 {} —— 因为它的属性不可枚举，JSON.stringify 看不见。
- 必须手动遍历：用
localStorage.length和localStorage.key(i)拿键名 - 再用
localStorage.getItem(key)取值，自己拼对象 - 否则导出的 JSON 是空的，但控制台看不出错，容易卡半天
导出时要注意哪些坑
实际用的时候，几个边界情况不处理，下载的文件就可能打不开或内容错乱：
-
localStorage里存了undefined或函数？JSON.stringify会直接丢掉，变成null或缺失字段 —— 建议统一转成字符串再存，导出前也做类型校验 - 键名含特殊字符（比如空格、斜杠）不影响下载，但后续用其他工具解析可能报错，可选做
encodeURIComponent编码（非必须） - 数据量大（比如 >5MB）时，Chrome 可能卡住或触发内存警告；建议加个简单大小检查：
JSON.stringify(obj).length > 4e6就提示“数据过大，建议清理” - 不要用
a.download设中文文件名，部分浏览器（尤其 Safari）会乱码；推荐固定名如localStorage-backup.json
一行能跑的最小可用代码
复制进控制台就能执行，适合临时备份：
立即学习“前端免费学习笔记（深入）”；
const data = {}; for (let i = 0; i < localStorage.length; i++) { const k = localStorage.key(i); data[k] = localStorage.getItem(k); } const blob = new Blob([JSON.stringify(data, null, 2)], {type: 'application/json'}); const url = URL.createObjectURL(blob); Object.assign(document.createElement('a'), {href: url, download: 'localStorage-backup.json'}).click(); URL.revokeObjectURL(url);
注意：如果某些值是日期、正则、BigInt，这个写法会丢失类型信息 —— 导出只是快照，不是深序列化，别指望它还原成可执行对象。
真正要长期存档，得提前约定数据结构，或者改用 structuredClone（仅现代浏览器支持）配合自定义序列化逻辑。但日常调试、临时导出，上面这段够用了。
