Какие методы для слушания событий важны на практике и чем они отличаются?

Методы для слушания событий: `addEventListener` (основной, гибкий), свойство `on (onclick), инлайн-атрибут (устаревший). В React — синтетические события (onClick`). Различаются гибкостью и числом обработчиков.**

Методы

addEventListener (предпочтительный)

element.addEventListener('click', handler, options);

• Несколько обработчиков на одно событие.
• Опции: capture (фаза), once (один раз), passive (не блокировать scroll).
• Снятие: removeEventListener.

Свойство on* (onclick, onkeydown)

element.onclick = handler;

• Только один обработчик (перезаписывается).
• Просто, но ограниченно.

Инлайн-атрибут (устаревший)

<button onclick="handler()">Кнопка</button>

• Смешивает разметку и логику — не рекомендуется.

React (синтетические события)

<button onClick={handler} />

• Обёртка над нативными (кроссбраузерность), делегирование на корень.

Различия

• Число обработчиков: addEventListener — много; on* — один.
• Гибкость: addEventListener — фазы, опции, снятие; on* — нет.
• Разделение логики/разметки: инлайн смешивает, остальные — нет.

Как выбирать

• Всегда → addEventListener (гибкость, несколько обработчиков).
• React → синтетические `onClick`.
• Инлайн-атрибуты — избегать.

Коротко для собеседования

Слушать события: addEventListener (предпочтительно — несколько обработчиков, опции capture/once/passive, снятие), свойство on* (onclick — один обработчик, перезаписывается), инлайн-атрибут (устарел, смешивает разметку/логику). В React — синтетические события (onClick, кроссбраузерная обёртка, делегирование). По умолчанию — addEventListener.