add a value to localstorage, instead of replacing it

Question

i want the value from newUsername to be added to the localStorage setUsernamesArray, whereas in my code, it replaces the entire value.

Code

$('#signUpButton').click(function() {
  var newUsername = $('#usernameSignInBox').val();
  signedUpUsernames.push(newUsername);
  localStorage.setItem('setUsernamesArray', signedUpUsernames);
});

Answer 1

If you want to add to the array, you must realise that the value in localStorage isn't an array, it is a string. If you want that string to represent an array, and you want to update that array, you must do the following things:

• read the string, localStorage.getItem('setUsernamesArray'),
• then convert it to an array with JSON.parse,
• then push to the array,
• and then store it again with localStorage.setItem('setUsernamesArray', JSON.stringify(array))

Answer 2

localStorage always store values as a string, so stringify your array and store,

localStorage.setItem('setUsernamesArray', JSON.stringify(signedUpUsernames));

And before reading it just parse it,

var arrayFrmStorage = JSON.parse(localStorage.getItem("setUsernamesArray"))