❓💭 Объясните делегирование событий в JavaScript

Делегирование событий — прием, который состоит в добавлении обработчиков событий к родительскому элементу, а не к дочерним. Обработчик будет срабатывать всякий раз, когда событие будет запущено на дочерних элементах благодаря всплытию событий в DOM. Преимущества этой техники очевидны:

➕Экономит объем используемой памяти, ведь для родительского элемента требуется только один обработчик.
➕Не требуется привязывать или убирать обработчики при добавлении и удалении элементов.

📌 А теперь пример

1️⃣ Самый простой пример: у вас есть HTML-страница, на которой расположена таблица с несколькими ячейками; ваша задача — реализовать подсветку ячейки при клике.

Вместо того, чтобы назначать обработчик onclick для каждой ячейки — можно повесить один обработчик на элемент. Он будет использовать event.target, чтобы получить элемент, на котором произошло событие, и подсветить его. В данном случае нет никакой разницы, сколько ячеек в таблице.

2️⃣ У делегирования есть и другое применение — действия в разметке. Например, вам требуется сделать меню с разными кнопками, а также у вас есть объект с соответствующими методами. Как их состыковать?

Вы можете добавить один обработчик для всего меню и атрибуты data-action для каждой кнопки в соответствии с методами, которые они вызывают.

3️⃣ Делегирование событий можно использовать для добавления элементам «поведения», декларативно задавая обработчики установкой специальных HTML-атрибутов и классов.

Приём проектирования «поведение» состоит из двух частей:
▫️Элементу ставится пользовательский атрибут, описывающий его поведение.
▫️При помощи делегирования ставится обработчик на документ, который ловит все клики (или другие события) и, если элемент имеет нужный атрибут, производит соответствующее действие.

#вопросы_с_собесов #easy

💬Напишите функцию на JavaScript, которая принимает параметр со строкой и преобразовывает ее в следующий вид:

"Привет Мир" => "прИвЕт мИр"
"Азбука Вкуса" => "АзбУкА вкУсА"

💡 Подсказка — "а", "е", "ё", "и", "о", "у", "ы", "э", "ю", "я"

😎 Через пару часов опубликуем решение!

#вопросы_с_собесов