Javascript Array 工作正常，但如果你离开页面会重新开始

Question

致力于学习 Javascript。我有这段代码，它工作正常。我的问题是，当我从表单创建数组时，离开页面并返回页面，向数组添加新数字，但数组以新数字重新开始。 有没有办法保留原始数组并向其推送新数字？或者这就是 Javascript 的工作方式吗？

const form = document.getElementById('form');
const show = document.getElementById('show');
let numArray = [];
//!number equals whatever is sent to this function
function getPushed(number) {
  numArray.push(number);
  localStorage.setItem('knife', JSON.stringify(numArray));
}

form.addEventListener('submit', (e) => {
  e.preventDefault();
  const numberToAdd = document.getElementById('numberAdd').value;
  parseInt(numberToAdd);
  show.innerHTML = numberToAdd;
  getPushed(numberToAdd);
});

谢谢你的时间

Answer 1

目前，您在每次加载页面时创建一个新数组，而不是使用保存在本地存储中的数组。这就是数组每次都重新开始的原因。

而是检查 'knife' 键中是否已经存储了数据。如果存在则使用它，否则默认返回到新创建的数组。

let numArray = [];
let storedData = localStorage.getItem('knife');
if (storedData !== null) {
  numArray = JSON.parse(storedData);
}