Обработка событий JavaScript (регистрация нескольких обработчиков) для объектов не из DOM

Question

В .NET вы можете добавить несколько обработчиков к событию, которое объект объявляет как событие.

Каков рекомендуемый способ обработки этого в JavaScript для объектов, не относящихся к DOM?

т.е. У меня есть объект:

var ProblemDomainObj = {} ;
ProblemDomainObj.Changed = function() {} ;
ProblemDomainObj.Data = { somedata : "initialized" } ;
ProblemDomainObj.Operate = function (newdata) {
    if (newdata != somedata && ProblemDomainObj.IsValid(newdata)) {
        somedata = newdata;
        ProblemDomainObj.Changed();
    }
} ;

Теперь другие объекты могут захотеть зарегистрироваться, чтобы знать, что данные изменились, и каждый хочет сделать что-то вроде этого:

ProblemDomainObj.Changed += function() {
     /* Do stuff to reflect the object model changes */
} ;

Где каждый может зарегистрировать свой обработчик, не перезаписывая другой.

Тогда какой-нибудь объект вызовет ProblemDomainObj.Operate(foo);, и все подписавшиеся получат уведомление.

Я нашел документацию в jQuery для http://api.jquery.com/on/, но, похоже, она связана с событиями DOM, такими как onclick. Ничто из этого не обязательно будет связано с DOM.

Answer 1

jQuery прекрасно работает и на обычных объектах: http://jsfiddle.net/gMNkg/.

var ProblemDomainObj = {};

ProblemDomainObj.Data = { somedata : "initialized" };

ProblemDomainObj.Operate = function () {
    $(ProblemDomainObj).trigger("foo"); // run bound functions
};


// bind 2 functions

$(ProblemDomainObj).on("foo", function() {
    alert(123);
});

$(ProblemDomainObj).on("foo", function() {
    alert(456);
});


ProblemDomainObj.Operate();

Answer 2

Если вы используете jQuery, вы можете добавить пользовательские события для любых объектов.

var obj = {a:1,b:2};
$(obj).on('changed', function() { alert('Changed once'); });
$(obj).on('changed', function() { alert('Changed twice'); });

$(obj).trigger('changed');

Выполнить код

Answer 3

function PubSub() {
    return {
        events: {},
        sub: function (event, handler) {
            if (!this.events[event]) {
                this.events[event] = [];    
            }
            this.events[event].push(handler);
        },
        pub: function (event, data) {
            this.events[event] && this.events[event].forEach(publishData);

            function publishData(handler) {
                handler(data);   
            };
        }
    };   
}

var pubsub = PubSub();
pubsub.sub("changed", f);
pubsub.sub("changed", g);
pubsub.pub("changed", o);

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

Я рекомендую вам написать собственную маленькую систему событий.

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

Answer 4

Вот один из способов использования замыкания

ProblemDomainObj.Changed = (function(previousChangeEvent) {
     return function () {
       if (previousChangeEvent) {
          previousChangeEvent();
       }
       /* Do stuff to reflect the object model changes */
     }
})(ProblemDomainObj.Changed) ;