Перевод статьи «Pub/Sub JavaScript Object», David Walsh
Есть три техники написания AJAX веб-сайтов: делегация событий, управление историей и коммуникация pub/sub на уровне приложения. Я использую все три техники и я хотел бы поделиться с вами самой простой из них: крошечным pub/sub модулем, который я использую на своем веб-сайте.
Если вы не знаете, что такое pub/sub, то суть в том, что вы публикуете в некую тему(topic), и кто угодно может на нее подписываться. Это похоже на то, как работает радио: радиостанция вещает (публикует) и каждый может слушать (подписываться). Это превосходный подход для модульных веб-приложений; это способ глобальной коммуникации без привязки к какому-то конкретному объекту.
Сам по себе модуль очень миниатюрный, но очень полезный:
Публикуем в тему:
… подписываемся на тему, чтобы получать уведомления о событиях:
Я скрупулезно использую pub/sub religiously на своем веб-сайте, и этот объект сделал мне кучу добра. У меня есть тема на загрузку страницы через AJAX и несколько подписок, которые вызываются при этом событии (перерисовка рекламы, комментариев, социальных иконок и тд.). Проверьте, где в вашем приложении можно использовать pub/sub!
Есть три техники написания AJAX веб-сайтов: делегация событий, управление историей и коммуникация pub/sub на уровне приложения. Я использую все три техники и я хотел бы поделиться с вами самой простой из них: крошечным pub/sub модулем, который я использую на своем веб-сайте.
Если вы не знаете, что такое pub/sub, то суть в том, что вы публикуете в некую тему(topic), и кто угодно может на нее подписываться. Это похоже на то, как работает радио: радиостанция вещает (публикует) и каждый может слушать (подписываться). Это превосходный подход для модульных веб-приложений; это способ глобальной коммуникации без привязки к какому-то конкретному объекту.
JavaScript
Сам по себе модуль очень миниатюрный, но очень полезный:
var events = (function(){ var topics = {}; return { subscribe: function(topic, listener) { // создаем объект topic, если еще не создан if(!topics[topic]) topics[topic] = { queue: [] }; // добавляем listener в очередь var index = topics[topic].queue.push(listener) -1; // предоставляем возможность удаления темы return { remove: function() { delete topics[topic].queue[index]; } }; }, publish: function(topic, info) { // если темы не существует или нет подписчиков, не делаем ничего if(!topics[topic] || !topics[topic].queue.length) return; // проходим по очереди и вызываем подписки var items = topics[topic].queue; items.forEach(function(item) { item(info || {}); }); } }; })();
Публикуем в тему:
events.publish('/page/load', { url: '/some/url/path' // любой аргумент });
… подписываемся на тему, чтобы получать уведомления о событиях:
var subscription = events.subscribe('/page/load', function(obj) { // делаем что-нибудь, когда событие происходит }); // ...теперь мне эта подписка больше не нужна... subscription.remove();
Я скрупулезно использую pub/sub religiously на своем веб-сайте, и этот объект сделал мне кучу добра. У меня есть тема на загрузку страницы через AJAX и несколько подписок, которые вызываются при этом событии (перерисовка рекламы, комментариев, социальных иконок и тд.). Проверьте, где в вашем приложении можно использовать pub/sub!
