Сегодня я хочу рассмотреть паттерн Observer и показать вам реализацию этого паттерна в JavaScript.
Что такое Наблюдатель?
Observer — это классический шаблон проектирования, который представляет отношения между сущностью издателя и подписчика (кратко pub-sub. Кроме того, многие разработчики ссылаются на шаблон Observer, называя его «pub-sub»).
Итак, кто наблюдатель, а кто слушатель. Вкратце — Listener подписывается на Observer и реагирует на уведомления Observer.
Мы можем сравнить это с радиостанцией. Радиостанция будет транслироваться независимо от того, слушаете вы или нет. Но если вы слушаете радиостанцию, вы получаете некоторую информацию, которой можно оперировать. В терминах Observer радиостанция является издателем, когда вы являетесь подписчиком. Паттерн Observer относится к реактивному программированию.
Как реализован наблюдатель
Как я сказал ниже, для реализации этого шаблона нам нужны два класса: Publisher и Subscriber. Publisher сохраняет подписчиков и вызывает их обратные вызовы, когда метод notify вызывается на Publisher.
JavaScript-код
Давайте реализуем паттерн Observer на JavaScript.
Издатель.js:
Подписчик.js:
index.js
Пояснения
Шаги по внедрению Publisher.js:
- Создайте хранилище подписчиков.
- Реализовать метод подписки (имя, обратный вызов). Метод добавляет новый слушатель в набор.
- Реализовать метод описания (имя). Метод удаляет слушателя из набора по имени.
- Реализовать метод уведомления (сообщения). Метод выполняет метод уведомления для каждого слушателя, передавая указанное сообщение.
Шаги по внедрению Subscriber.js:
- Создайте атрибут для имени и обратного вызова, который будет выполняться при вызове метода уведомления (сообщения).
- Реализовать метод уведомления (сообщения), который выполняет обратный вызов слушателей, передавая параметр
message.
В файле index.js мы объявляем Publisher и подписываемся на три разных слушателя. Затем мы вызываем метод наблюдателя notify с сообщением «Тестовая строка номер один». Затем отписываемся от третьего слушателя, чтобы проверить, работает ли метод describe. Вызовите метод уведомления еще раз. Запустите программу.
Как видим, три слушателя успешно подписаны и третий успешно описан!
Поздравляем!
Сегодня мы рассмотрели и реализовали паттерн Observer (pub-sub) в JavaScript!
Спасибо за чтение!
Буду признателен, если вы поддержите меня на Patreon или Boosty
Следите за мной в телеграмме: https://t.me/secretsupper (большую часть контента можно найти именно в телеграме).
Следите за мной в твиттере: https://twitter.com/MaksymovArtem
