0

По-прежнему продолжаю разбираться с кодом сайта Читай-город

Среди файлов нашел Читай-город - интернет-магазин книг_files\eventEmitter.js.Без названия (сохраните страницу на диске)

function EventEmitter(){
    var eventSubscribers = {};

//Диспетчирезация события
this.dispatch = function (eventName, payload){
    if(eventSubscribers.hasOwnProperty(eventName)){
        eventSubscribers[eventName].forEach(function (eventHandler){
            eventHandler(payload);
        });
    }

    return true;
};

//Подписка на событие. Возвращает метод отписки handler от события
this.subscribe = function (eventName, handler){
    if(typeof handler !== 'function'){
        return;
    }

    if(!eventSubscribers.hasOwnProperty(eventName)){
        eventSubscribers[eventName] = [];
    }

    eventSubscribers[eventName].push(handler);

    return function (){
        eventSubscribers[eventName] = eventSubscribers[eventName].filter(function (currentHandler) {
            return currentHandler !== handler;
        });
    }
}



}


window.eventEmitter = new EventEmitter();

Возникли вопросы:

  1. Что такое диспетчерезация события?
  2. И что означает

Возвращает метод отписки handler от события

?

Особенно меня смущает

this.dispatch = function (eventName, payload){
            if(eventSubscribers.hasOwnProperty(eventName)){
                eventSubscribers[eventName].forEach(function (eventHandler){
                    eventHandler(payload);
                });
            }

А именно цикл forEach, по-моему правильно было бы

    this.dispatch = function (eventName, payload){
        if(eventSubscribers.hasOwnProperty(eventName)){
            eventSubscribers[eventName]=(function (eventHandler){
                eventHandler(payload);
            });
        }

    return true;
};</code></pre>
ProgrammerOfParadoxThings
  • 39

1 Answers1

0
  1. Это просто механизм событий. Аналог обычных событий документа. Только здесь, в отличие от документа, события не привязаны к элементам документа, а работают отдельно. То же самое есть например в jQuery, например когда событие можно вызвать у любого объекта. Метод dispatch (аналог element.dispatchEvent()) вызывает событие, другими словами запускает функцию, которую ранее добавили методом subscribe (аналог element.addEventListener()).
  2. После того, как подписал какую-то функцию на событие, нужно иметь возможность её отписать когда-то. Вот метод для этого. В jQuery например есть аналогичный метод off, а в DOM есть метод element.removeEventListener().
  • а чему равно eventHandler при первом вызове? (это во-первых) Во-вторых, в объекте eventSubscribers получается несколько элементов с одним и тем же полем eventName. – ProgrammerOfParadoxThings Oct 23 '20 at 17:29
  • если использовать цикл forEach – ProgrammerOfParadoxThings Oct 23 '20 at 17:54
  • Ну да, там массив функций. Так часто бывает, что на один тип события много обработчиков вешается. Поэтому там forEach, чтобы вызвать все. А eventHandler - это одна из навешанных функций на это имя события. –  Oct 23 '20 at 18:01
  • Уточню, там не много элементов с одним полем, а это массив. Собственно он задаётся в методе subscribe - eventSubscribers[eventName] = []; –  Oct 23 '20 at 18:04
  • var eventSubscribers = {}; - eventSubscribers - объект (см. 2-ю строку), а eventSubscribers[eventName] = []; - массив.Поэтому в eventSubscribers одному полю eventName соответствует несколько функций. – ProgrammerOfParadoxThings Oct 23 '20 at 18:38
  • Нет. Одному полю соответствует массив. А у же в массиве его ключи ссылаются на разные функции. –  Oct 23 '20 at 18:39
  • а если return function (){eventSubscribers[eventName] = eventSubscribers[eventName].filter(function (currentHandler) {return currentHandler !== handler; });}, то в массив записываются функции, не принадлежащие текущему элементу eventName в объекте eventSubscribers. – ProgrammerOfParadoxThings Oct 23 '20 at 19:07