инициализировать массив, который находится внутри объекта, использовать в localStorage

Question

Изолированный вопрос:

user[username] = { 
  cool: true,
  stuff: false,
  arrData: []
};

Я пытаюсь глобально инициализировать мой массив arrData для заполнения в другой области; ниже не работает.

let user.arrData = [],

позже я хочу сделать следующее, для контекста:

...........
  inputs.forEach(function(input){
      user = JSON.parse(localStorage.getItem(username)); // tried moving this here
      user.arrData.push({ id: input.id, checked: input.checked });
      // the above errors on .arrData cannot push undefined, I have tried also including the key here, how is this done?
  });
  localStorage.setItem(user, JSON.stringify(user.arrData));
  console.log({ arrData: user.arrData }); // returns undefined
............

Подвопрос: Могу ли я установить и получить object.array с localStorage вот так. Имеется в виду моя ссылка на (user.arrData)?

---

Контекст / фактический код:

Ниже приведен полный соответствующий код для контекста: я пытаюсь сохранить ряд состояний флажков на пользователя с локальным хранилищем, а затем перезагрузите его при нажатии кнопки.

let user = {};
var savebtnBM = document.getElementById("savebtnBM");
const username = document.querySelector("span.name").textContent;

user[username] = { 
   cool: true,
   stuff: false,
   arrData: []
};

var layersMod =  document.querySelectorAll(".layers #savebtnBM")[0];
layersMod.addEventListener('click', ()=>{ 
setTimeout(
  function() {
    Saver();
  }, 2000);
});

function Saver() { 
  var inputs = document.querySelectorAll('input[type="checkbox"]');
  // var arrData = [];
  inputs.forEach(function(input){
    user[username].arrData.push({ id: input.id, checked: input.checked });
  });
  localStorage.setItem(user, JSON.stringify(user.arrData));
  console.log(JSON.stringify(user.arrData));
}

var etHOME= document.getElementById("et-phone-home");
etHOME.addEventListener('click', ()=>{
    user = JSON.parse(localStorage.getItem(username));
    console.log(user);
    document.getElementsByClassName("big-button")[0].click();
    setTimeout(load_, 2000);

    function load_() {
      var inputs = JSON.parse(localStorage.getItem(user));
      inputs.forEach(function(input){
        document.getElementById(input.id).checked = input.checked;
        load__();
      });
    function load__() { 
        var elems = document.querySelectorAll('input:checked');
        for(var i = 0; i<elems.length; i++) {
          elems[i].click();
        }
      }
    } 
});

Answer 1

Ответ на дополнительный вопрос:

---

localStorage и sessionStorage могут обрабатывать только строки.

Итак, сначала мы должны преобразовать наш объект в строку с JSON.stringify() как в следующем примере:

localStorage.setItem('user', JSON.stringify(user));

Когда дело доходит до получения ранее сохраненного, мы делаем противоположное, используя JSON.parse():

//...
const storedUser = JSON.parse(localStorage.getItem('user'));
console.log({ arrData: storedUser.arrData });