Как сохранить JavaScript переменных даже после перезагрузки или закрытия вкладки?

Question

Я уже видел и пробовал

var someVarName = "value";
localStorage.setItem("someVarKey", someVarName);
var someVarName = localStorage.getItem("someVarKey");

Но я не понимаю, как рассчитать с этим. Скажем, у меня есть переменная, оценка, и я хочу, чтобы она увеличивалась до степени 1,1 каждый раз, когда запускается функция frame ().

var score = 2;

function frame() {
  score = Math.pow(score, 1.1);
  Console.log(score.toFixed(2));
}
setInterval(frame, 25);

Как бы это настроить, чтобы даже когда вы перезагрузите страницу, она останется такой, какой была раньше? Даже когда я попытался настроить локальное хранилище, я не могу получить к нему доступ после перезагрузки.

Answer 1

Попробуйте сначала определить, был ли ваш счет уже сохранен или нет. Сейчас кажется, что вы продолжаете перезаписывать элемент 'score' в хранилище обратно на 2 каждый раз, когда загружаете страницу.

Итак, извлеките элемент 'score' из хранилища и проверьте, является ли значение null. Это будет означать, что значение не сохраняется, и его следует создать.

В вашей функции frame обновляйте элемент счета в хранилище после каждого вычисления. Таким образом, значение хранилища всегда обновляется до самого последнего расчета и продолжается при указанном значении всякий раз, когда вы перезагружаете страницу.

function saveScore(score) {
  localStorage.setItem('score', score);
}

let score = localStorage.getItem('score');
if (score === null) {
  score = 2;
  saveScore(score);
}

function frame() {
  score = Math.pow(score, 1.1);
  saveScore(score);
  console.log(score.toFixed(2));
}

setInterval(frame, 25);

Answer 2

var score = 2;
localStorage.removeItem("score");
var oldScore = localStorage.getItem("score");
if (oldScore) {
  score = parseFloat(oldScore);
}

function frame() {
  score = Math.pow(score, 1.1);
  localStorage.setItem("score", score);
  console.log(score.toFixed(2));
}

setInterval(frame, 25);