localStorage可存游戏最高分和多人排名：单人用字符串存数字，多人用JSON序列化数组并排序；需检测支持性、try-catch防护、限制条数、避免存敏感信息，清除用removeItem或clear。
用 HTML5 的 localStorage 存储游戏最高分和排名，核心是把数据结构化保存为字符串，并在读取时还原。它不联网、不依赖服务器，所有记录只存在用户本机浏览器里，关机重启也不丢——适合轻量级单机游戏。
怎么存最高分（单人）
每次游戏结束，先读出已有的最高分，再比对更新：
- 用
localStorage.getItem('snake_best_score')获取当前最高分（返回字符串或 null） - 把新分数转成数字，与已存分数比较：
const newScore = parseInt(score); const oldScore = parseInt(localStorage.getItem('snake_best_score') || '0'); - 如果新分更高，就存入：
localStorage.setItem('snake_best_score', newScore.toString());
怎么存多人历史记录与排名
不能只存一个值，得用数组结构存多个玩家记录，再按分数排序显示前 N 名：
- 约定格式：每个记录是对象，如
{name: "小明", score: 1280, time: 1710632400000} - 读取时用
JSON.parse(localStorage.getItem('game_history') || '[]')得到数组 - 新增记录后，push 进数组，再按 score 降序排序：
records.sort((a,b) => b.score - a.score) - 保存前用
JSON.stringify(records)转成字符串再写入：localStorage.setItem('game_history', jsonStr) - 建议限制条数（比如最多存 20 条），避免体积膨胀
怎么安全可靠地读写
浏览器可能禁用 localStorage，或存储满报错，必须加防护：
- 存之前先检测支持性：
if (typeof localStorage === 'object') - 用 try-catch 包裹关键操作，防止 JSON 解析失败或配额超限中断脚本
- 避免直接存 undefined 或 null，统一转成空字符串或默认值
- 敏感信息如用户身份、token 不要放这里——localStorage 可被任意 JS 读取，有 XSS 风险
怎么清空或重置记录
提供“清除成绩”按钮，对应执行：
-
localStorage.removeItem('snake_best_score')——删单个 -
localStorage.removeItem('game_history')——删历史列表 - 或者一步清空全部：
localStorage.clear()（慎用，会删掉其他功能的数据）
不复杂但容易忽略细节，关键是结构清晰、容错到位、不越权存敏感内容。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
