Создает ли этот addEventListener в цикле с анонимными функциями 30 отдельных функциональных объектов? - PullRequest
0 голосов
/ 29 октября 2018

Вопрос 1а: Привет, мне интересно, приведет ли запуск версии 1 следующего кода в создании нескольких анонимных функций (в части addEventListener), по одной для каждого элемента в списке интерактивных узлов?

Вопрос 1b: В версии 2 я просто передал addEventListener ссылку на другую функцию. Есть ли преимущество для версии 2 по сравнению с версией 1?

Оба моих вопроса связаны между собой. Я не уверен, что addEventListener разделяет анонимные функции между различными элементами. Пожалуйста, будьте настолько подробны, как вы хотите. Буду весьма признателен за это. Заранее спасибо. :)

Дополнительная информация: Я ожидаю, что длина списка узлов, по которым можно кликать, будет от 28 до 31 (календарь).

Версия 1:

Base.prototype.addCalendarClickEffect = function () {
    let clickable_node_list = this.clickable_node_list
    let lastElementClicked = null;

        for(let i = 0; i< clickable_node_list.length; i++){
          clickable_node_list[i].addEventListener("click", function (event) {
              if(lastElementClicked){
                lastElementClicked.classList.remove("clicked");
              }
              event.target.classList.add("clicked");
              lastElementClicked = event.target;
          });
        }
}

Версия 2:

Base.prototype.addCalendarClickEffect = function () {
    let clickable_node_list = this.clickable_node_list

        for(let i = 0; i< clickable_node_list.length; i++){
          clickable_node_list[i].addEventListener("click", toggleClickedClass);
        }
}

function toggleClickedClass(event) {
  if(lastElementClicked){
    lastElementClicked.classList.remove("clicked");
  }
  event.target.classList.add("clicked");
  lastElementClicked = event.target;
}
...