Простая система хуков

Недавно искал для рабочего проекта простую систему хуков для перехвата процессов в компонентах на фронтенде.

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

Было решено написать свою простую реализацию с возможностью отката изменений, если в одном из хуков произошла ошибка.

Основные особенности:

  • EventEmitter стиль использования
  • Приоритезация
  • Обработка ошибок

Установка

npm install eshooks 1

Использование

Для начала создадим новое хранилище хуков используя оператор new. В итоге создается объект с двумя простыми методами on() и trigger() для регистрации и вызова хуков.

Чтобы зарегистрировать хук используем метод on(name, handler). Где name это имя коллекции хуков в которое добавляется обработчик, а handler - функция обработки, которая будет вызвана и может вернуть Promise объект для асинхронных операций. Если ничего не было возвращено, то хук выполняется синхронно.

Для вызова хуков, в нужном нам месте кода вызываем trigger(name[, args]) и можем передать произвольное количество аргументов в функции обработки хуков.

Метод trigger вернет Promise и после выполнения всех хуков, вызывается соответствующая результату функция переданная в .then(onSuccess, onError).

В консоли будет следующее:

Pre-start check - stage 0: ["test"]  
Pre-start check - stage 1: ["test"]  
Starting...  

Приоритет выполнения

Приоритет выполнения обработчиков может быть установлен вторым аргументом в методе .on(name, priority, handler). Хуки выполняются по возрастанию приоритета.

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

В консоль получим:

Pre-start check - stage 0: ["test"]  
Pre-start check - stage 1: ["test"]  
Pre-start check - stage 2: ["test"]  
Pre-start check - stage 3: ["test"]  
Starting...  

Обработка ошибок в хуках

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

Если один из хуков генерирует ошибку посредством throw err или вернет Promise.reject(err), будут вызваны обработчики уже выполненных хуков.

Важная особенность - обработчики ошибок вызываются последовательно и в обратном порядке их регистрации.

Таким образом, получаем возможность откатить изменения внесенные в состояние виджетов или отправить информацию об ошибке на сервер.

Результат в консоли:

Pre-start check - stage 0  
Pre-start check - stage 1  
Reverting stage 1  
Reverting stage 0  
Aborting... Error 'test'  

Итог

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