localStorage имеет значение null, но только из одной функции, а не из другой

Question

У меня есть страница PHP, которая загружает два файла JS в конце. В первом файле у меня есть это ...

// global variables
var refineSearchStorage = {};

// function calls
window.addEventListener("load", function() {
  refineSearchStorage.get();
});

refineSearchStorage = {
  data : null, // empty storage
  get : function() {
    refineSearchStorage.data = localStorage.getItem("refineSearchStorage");
    if(refineSearchStorage.data === null) { 
      refineSearchStorage.data = { refineKeywords: '' };
      refineSearchStorage.save();
    }
    else { 
      refineSearchStorage.data = JSON.parse(refineSearchStorage.data); 
    }
  },
  add : function(x) {
    refineSearchStorage.data.refineKeywords = x;
    refineSearchStorage.save();
  },
  save : function() {
    localStorage.setItem("refineSearchStorage", JSON.stringify(refineSearchStorage.data));
  }
};

Inline javascript вызывает функцию 1 из середины страницы. Она создается PHP после результата поиска ...

<script>
  window.addEventListener('load', function () {
    searchActions('{$keywords_human}');
  });
</script>

Функция 1 появляется на 2-й странице JS, и результат равен Uncaught TypeError: Cannot set property 'refineKeywords' of null ... вместо добавления в localStorage.

function searchActions(x) {
  refineSearchStorage.add(x);
}

Функция 2, приведенная ниже, вызывается нажатием кнопки и без проблем добавляет переменную localStorage. Она также находится на 2-й странице JS ...

function keywordAdd(y) {
  var existingParams = refineSearchStorage.data.refineKeywords;
  var param = y.toLowerCase();
  var newParams;
  newParams = (existingParams + ' ' + param).trim();
  refineSearchStorage.add(newParams);
}

Раньше работала функция 1, но я сделал что-то, чтобы сломать ее, когда разделил функции на разные страницы. Что я сделал?

Answer 1

Это потому что

window.addEventListener('load', function () {
    searchActions('{$keywords_human}');
  });

вызывается раньше

window.addEventListener("load", function() {
  refineSearchStorage.get();
});

Answer 2

Эта ошибка означает, что ваш атрибут data равен null

(снимок экрана). Посмотрите, что я имею в виду под

конвертировать добавить в

add : function(x) {
    refineSearchStorage.data = refineSearchStorage.data || {};  // this might help
    refineSearchStorage.data.refineKeywords = x;
    refineSearchStorage.save();
},