Блог

Я подключил прослушиватель событий в модуле, используя

 document.addEventListener('keydown', () => this.clickCatcherFunction(target_id));
  

но когда эта функция выполняется, строка

 document.removeEventListener("keydown", () => this.clickCatcherFunction());
  

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

другие неудачные попытки:

 document.removeEventListener("keydown", this.clickCatcherFunction());
document.removeEventListener("keydown", clickCatcherFunction());
document.removeEventListener("keydown", clickCatcherFunction);
  

Можно удалить только именованные функции, не анонимные функции, потому что даже если вы создадите идентичную анонимную функцию, это не будет точно такой же экземпляр функции, которую вы ранее добавили. Вам придется настроить свою функцию отдельно, вот так:

 function clickCather(evt){
  .  .  .
}
  

Затем вы можете добавлять и удалять его с помощью addEventListener("click", clickCatcher) и removeEventListener("click", clickCatcher); , потому что вы будете ссылаться на тот же экземпляр функции в памяти.

И обратите внимание, что с помощью addEventListener и removeEventListener вы не вызываете свою функцию (без круглых скобок в конце имени функции), вы хотите только ссылаться на нее.