Что такое эмиттер событий?

Генератор событий, как он звучит, - это просто то, что запускает событие, которое может прослушать каждый.

Представьте себе способность, особенно при работе с асинхронным кодом, «кричать» о том, что в вашем коде происходит какое-то событие, и позволять другим частям вашей системы, которым это небезразлично, «слышать» ваш крик и регистрировать свое намерение.

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

Наша цель здесь - создать собственный эмиттер событий, чтобы понять, как работает магия. Итак, давайте посмотрим, как мы можем заставить приведенный ниже код работать.

Давайте начнем.

Мы начинаем с создания класса EventEmitter и инициализируем свойство events как пустой объект. Назначение свойства events - хранить имя нашего события в качестве ключа и значение в виде массива подписчиков (то есть функций).

Функция подписки:

Функция подписки принимает имя события, в нашем примере это будет event:name-changed, и функцию, вызываемую, когда кто-то испускает (или кричит) событие.

Одним из преимуществ функций в Javascript является то, что функции являются «объектами первого класса», поэтому мы можем передать функцию в качестве параметра другой функции, как мы это делали в нашем методе подписки.

Если никто еще не регистрирует событие, которое нам нужно сделать в первый раз, задав ключ в качестве имени события и инициализируя его пустым массивом, мы помещаем в этот массив функцию, которую хотим выполнить, когда кто-то испускает событие. .

Функция испускания:

Функция emit принимает имя события, которое мы хотим «кричать», и данные, которые мы хотим отправить с этим событием. Если событие существует в нашей карте событий, мы перебираем функции, которые мы регистрируем в методе подписки, и вызываем их с данными.

Это все, что нужно для работы приведенного выше кода. Но у нас все еще есть одна проблема. Нам нужен способ отменить регистрацию этих функций, когда они нам больше не нужны, потому что, если вы этого не сделаете, у вас будет утечка памяти.

Давайте решим эту проблему, вернув функцию отказа от подписки из метода subscribe.

Поскольку в Javascript функции являются «первоклассными объектами», вы можете возвращать функцию из функции. Итак, теперь мы можем вызвать функцию отказа от подписки следующим образом:

Когда мы вызываем функцию отказа от подписки, мы удаляем функцию, на которую мы подписались, с помощью метода фильтрации.

Прощай, утечка памяти!

С кодом можно поиграться здесь, вот и все.

💥 И последнее, но не менее важное: слышали ли вы об аките?

Акита - это модель управления государством, которую мы разработали здесь, в Datorama. Он успешно используется в среде производства больших данных, и мы постоянно добавляем в него функции.

Акита поощряет простоту. Он избавляет вас от хлопот по созданию шаблонного кода и предлагает мощные инструменты с умеренной кривой обучения, подходящие как для опытных, так и для неопытных разработчиков.

Я очень рекомендую это проверить.