TGViewer
Defront — про фронтенд-разработку и не только Defront — про фронтенд-разработку и не только @defront · 5.05K subscribers
Post #757 4.08K
Стэфан Джудис написал небольшую статью про малоизвестную фичу addEventListener — "addEventListener accepts functions and (!) objects".

Метод addEventListener в качестве обработчика события может использовать функцию или объект, реализующий интерфейс EventListener (объект с методом handleEvent ). Использование объекта позволяет инкапсулировать обработку событий DOM-элементов в рамках одного класса.

class EventHandler {
constructor() {
this.count = 0;
}

handleEvent() {
this.count++;
console.log(`Clicks: ${this.count}`);
}
}

document
.querySelector('button')
.addEventListener(
'click',
new EventHandler()
);


#js

https://www.stefanjudis.com/today-i-learned/addeventlistener-accepts-functions-and-objects/
Stefanjudis addEventListener accepts functions and (!) objects addEventListener accepts callback functions but also elements that implement the EventListener interface
More from @defront
  1. Jan 7, 2024Channel name was changed to «Defront — про фронтенд-разработку и не только»
  2. Feb 24, 2022Про войну в Украине Шлю лучи поддержки братьям и сёстрам украинцам. В моём окружении нет н…
  3. Feb 23, 2022Qwik — возобновляемый JavaScript-фреймворк Райан Карниато поделился своими мыслями после р…
  4. Feb 22, 2022Обработка ошибок с помощью reportError Стэфан Джудис рассказал про малоизвестный метод для…
  5. Feb 21, 2022Выбор библиотеки по её размеру Владимир Клепов рассказал про подводные камни выбора библио…
  6. Feb 10, 2022Time-travel debugging в Svelte Сэм Ван Тассел рассказал про DeLorian — новый инструмент дл…
Threads Profile ViewerView any public Threads profile without an account.Open ThreadLook →Writing with AI? Make it sound human.Metric37 rewrites AI drafts so they read naturally. Free AI detector, 1,500 words free.Try Metric37 →