Что такое эмиттер событий?
Генератор событий, как он звучит, - это просто то, что запускает событие, которое может прослушать каждый.
Представьте себе способность, особенно при работе с асинхронным кодом, «кричать» о том, что в вашем коде происходит какое-то событие, и позволять другим частям вашей системы, которым это небезразлично, «слышать» ваш крик и регистрировать свое намерение.
Существует множество различных реализаций для разных целей шаблона генератора событий, но основная идея состоит в том, чтобы предоставить структуру для управления событиями и иметь возможность подписываться на них.
Наша цель здесь - создать собственный эмиттер событий, чтобы понять, как работает магия. Итак, давайте посмотрим, как мы можем заставить приведенный ниже код работать.
Давайте начнем.
Мы начинаем с создания класса EventEmitter
и инициализируем свойство events как пустой объект. Назначение свойства events - хранить имя нашего события в качестве ключа и значение в виде массива подписчиков (то есть функций).
Функция подписки:
Функция подписки принимает имя события, в нашем примере это будет event:name-changed
, и функцию, вызываемую, когда кто-то испускает (или кричит) событие.
Одним из преимуществ функций в Javascript является то, что функции являются «объектами первого класса», поэтому мы можем передать функцию в качестве параметра другой функции, как мы это делали в нашем методе подписки.
Если никто еще не регистрирует событие, которое нам нужно сделать в первый раз, задав ключ в качестве имени события и инициализируя его пустым массивом, мы помещаем в этот массив функцию, которую хотим выполнить, когда кто-то испускает событие. .
Функция испускания:
Функция emit принимает имя события, которое мы хотим «кричать», и данные, которые мы хотим отправить с этим событием. Если событие существует в нашей карте событий, мы перебираем функции, которые мы регистрируем в методе подписки, и вызываем их с данными.
Это все, что нужно для работы приведенного выше кода. Но у нас все еще есть одна проблема. Нам нужен способ отменить регистрацию этих функций, когда они нам больше не нужны, потому что, если вы этого не сделаете, у вас будет утечка памяти.
Давайте решим эту проблему, вернув функцию отказа от подписки из метода subscribe.
Поскольку в Javascript функции являются «первоклассными объектами», вы можете возвращать функцию из функции. Итак, теперь мы можем вызвать функцию отказа от подписки следующим образом:
Когда мы вызываем функцию отказа от подписки, мы удаляем функцию, на которую мы подписались, с помощью метода фильтрации.
Прощай, утечка памяти!
С кодом можно поиграться здесь, вот и все.
💥 И последнее, но не менее важное: слышали ли вы об аките?
Акита - это модель управления государством, которую мы разработали здесь, в Datorama. Он успешно используется в среде производства больших данных, и мы постоянно добавляем в него функции.
Акита поощряет простоту. Он избавляет вас от хлопот по созданию шаблонного кода и предлагает мощные инструменты с умеренной кривой обучения, подходящие как для опытных, так и для неопытных разработчиков.
Я очень рекомендую это проверить.