javascript local storage find out if exists

Question

I have the following used to create a dummy high score table if if localscores doesn't exist in local storage:

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")
}

I always want to maintain 10 scores so I have this to add a score, where username and total are the name entered and score achieved:

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);

Everything is fine until I reload the game and the first function runs, it seems to add null value to the highscores array. So if I add 5 additional scores I will have 3 null values in the array?

[Object, Object, Object, Object, Object, Object, Object, Object, Object, Object, null, null, null, null, null]

This leads me to believe either the line where I evaluate if the localscores exists is wrong (localStorage.getItem("localScores") === null)

Or where I delete the 11th element in the array is wrong delete highscores[10];

Or there's some other issue I don't see, if anyone knows what's going on I'd very much appreciate some help.

Kevin Ennis · Accepted Answer · 2012-03-31 00:43:36Z

4

When you call delete on an Array instance, you don't actually make the array shorter, you just replace the value at the specified index with undefined.

If the length of highscores should always be no greater than 10, and the item to be removed will always be the last, you could simply use highscores.length = 10.

You could also use highscores = highscores.slice(0,10);, but as jfriend00 pointed out, it does involve the extra overhead of creating a new array.

Although, I feel compelled to mention that the performance hit of creating a new array is really just a drop in the bucket compared to the amount of work the browser will be doing to encode/decode JSON and read/write from localStorage, which is notoriously slow.

edited Mar 31, 2012 at 0:43

answered Mar 31, 2012 at 0:27

Kevin Ennis

14.5k2 gold badges46 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

jfriend00 Over a year ago

This would work also for trimming the highscores: if (highscores.length > 10) {highscores.length = 10;} and this wouldn't be making a copy of the array like .slice() does.

stewe · Accepted Answer · 2012-03-31 00:32:55Z

3

You could use highscores.pop() instead of delete highscores[10];

answered Mar 31, 2012 at 0:32

stewe

42.8k13 gold badges82 silver badges77 bronze badges

Collectives™ on Stack Overflow

javascript local storage find out if exists

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related