Как инженеры-программисты, мы стремимся писать понятный, многоразовый и красноречивый код, который мог бы жить вечно в больших приложениях. Код, который мы создаем, должен решать реальные проблемы. Мы, конечно же, не пытаемся создать избыточный, ненужный или «просто для удовольствия» код. В то же время мы часто сталкиваемся с проблемами, которые уже имеют хорошо известные решения, которые были определены и обсуждены мировым сообществом или даже нашими собственными командами миллионы раз. Эти решения таких проблем называются «шаблонами проектирования».

Шаблоны проектирования в JavaScript

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

Шаблон команды

Просто представьте, что в вашей квартире есть телевизор, и у вас есть пульт от него. Когда вы («клиент») нажимаете любую кнопку (например, «Увеличение громкости») на пульте дистанционного управления («вызывающий»), он отправляет сигнал на ваш телевизор («приемник»), и команда выполняется с определенным результатом. Это в основном то, как шаблон команды используется в действии.

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

Реализация была примерно следующая:

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

Шаблон строителя

Вы когда-нибудь заказывали что-нибудь в McDonald’s? Вообще говоря, после того, как вы сделаете сложный заказ, ваш заказ будет состоять из нескольких компонентов, например, напиток, бургер и картофель фри, шаг за шагом. Вы не знаете, как она была построена или приготовлена, вы просто ждете готовой еды. Точно так же строитель инкапсулирует весь процесс.

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

Высокоуровневая реализация описанного шаблона JS:

Этот паттерн помог добиться четкого разделения между построением и представлением объекта, а также лучше контролировать сам процесс построения.

Шаблон специального случая

Время от времени, определяя классы и объекты, которые будут обрабатывать какие-то данные, мы не хотим менять поведение кода, если что-то пойдет не так. Вместо этого мы безопасно справимся с этой уникальной ситуацией, чтобы избежать немедленного сбоя или ошибки. Вот тут-то и появляется шаблон JavaScript «Особый случай» Мартина Фаулера.

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

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

Давайте посмотрим на пример кода этого шаблона JavaScript:

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

Заключительные мысли

Многие шаблоны проектирования JavaScript четко определены и описаны в статьях, подобных этой. Однако, пожалуйста, избегайте склонности к чрезмерному использованию. Как говорится: «Если у вас есть только молоток, все выглядит как гвоздь». Вы не хотите попасть в ловушку чрезмерного использования, поэтому используйте эти шаблоны JS только тогда, когда это необходимо, и когда они могут решить реальную проблему в вашем коде.

Спасибо за прочтение!



«Менее популярные шаблоны проектирования JavaScript
Как инженеры-программисты, мы стремимся писать понятный, многоразовый и красноречивый код, который может жить вечно в большом количестве…где угодно. epam.com»



Создавайте компонуемые веб-приложения

Не создавайте веб-монолиты. Используйте Bit для создания и компоновки несвязанных программных компонентов — в ваших любимых фреймворках, таких как React или Node. Создавайте масштабируемые интерфейсы и серверные части с мощным и приятным опытом разработки.

Перенесите свою команду в Bit Cloud, чтобы совместно размещать и совместно работать над компонентами, а также значительно ускорить, масштабировать и стандартизировать разработку в команде. Начните с компонуемых интерфейсов, таких как Design System или Micro Frontends, или исследуйте компонуемый сервер. Попробуйте →

Узнать больше