Как работает привязка `this` в обработчиках событий?

Question

Accepted Answer

## Простая формулировка
Для обычной функции в `addEventListener` браузер вызывает слушатель с `this` = элемент, на котором зарегистрирован обработчик (то же, что `event.currentTarget`).

## Подробности

`event.target` — элемент-источник события (может быть потомок). Стрелка захватывает лексический `this` (часто `window`/класс), а не элемент. `bind` явно фиксирует значение для обычной функции.

Если нужен и элемент, и методы класса — часто пишут обычный метод + `this.handle = this.handle.bind(this)` или стрелочное поле класса, а элемент берут из `event.currentTarget`.

## Итог

Не-стрелка в listener → `this` = currentTarget; стрелка → лексический `this`.