javascript本地存储找出是否存在

Question

如果本地存储中不存在 localscores，我将使用以下内容创建虚拟高分表：

if (localStorage.getItem("localScores") === null) {

highscores = [
  {user: "Player 1", score: 100},
  {user: "Player 2", score: 90},
  {user: "Player 3", score: 80},
  {user: "Player 4", score: 70},
  {user: "Player 5", score: 60},
  {user: "Player 6", score: 50},
  {user: "Player 7", score: 40},
  {user: "Player 8", score: 30},
  {user: "Player 9", score: 20},
  {user: "Player 10", score: 10}
  ];
  localStorage['localScores']=JSON.stringify(highscores);
  console.log("doesn't exist")
}

else{
highscores = JSON.parse(localStorage['localScores']);
console.log("exists")
}

我一直想保持 10 分，所以我有这个来添加一个分数，其中 username 和 total 是输入的名称和达到的分数：

highscores.push({user: username, score: total});                               
highscores.sort(function(a,b){ return b.score - a.score});    
delete highscores[10];
localStorage['localScores']=JSON.stringify(highscores);
console.log(highscores);

一切都很好，直到我重新加载游戏并且第一个函数运行，它似乎向 highscores 数组添加了空值。所以如果我添加 5 个额外的分数，我将在数组中有 3 个空值？

[对象，对象，对象，对象，对象，对象，对象，对象，对象，对象，空，空，空，空，空]

这让我相信我评估本地分数是否存在的那一行是错误的 (localStorage.getItem("localScores") === null)

或者我删除数组中第 11 个元素的地方是错误的 删除高分[10];

或者还有其他一些我看不到的问题，如果有人知道发生了什么，我将非常感谢一些帮助。

Answer 1

当您在 Array 实例上调用 delete 时，实际上并没有使数组更短，您只需将指定索引处的值替换为 undefined。

如果highscores的长度总是不大于10，并且要删除的项目总是最后一个，你可以简单地使用highscores.length = 10。

您也可以使用highscores = highscores.slice(0,10);，但正如 jfriend00 所指出的，它确实涉及创建新数组的额外开销。

尽管我不得不提一下，与浏览器对 JSON 进行编码/解码以及从 localStorage 读取/写入的工作量相比，创建新数组对性能的影响实际上只是杯水车薪，这是出了名的慢。

Answer 2

您可以使用 highscores.pop() 而不是 delete highscores[10];