JS观察者模式

Question

我尝试了观察者模式（通过这两个网址：https://davidwalsh.name/pubsub-javascript, http://www.dofactory.com/javascript/observer-design-pattern）但是当我调用发布函数时监听器数组是空的。

main.pagination.event= (function () {
    var listeners = [];   
    return {
        subscribe: function (fn) {
            listeners.push(fn);
            return {
                unsubscribe: function (fn) {
                    listeners= listeners.filter(
                        function (item) {
                            if (item !== fn) {
                                return item;
                            }
                        }
                    );
                }
            };
        },
        publish: function () {
            //it's empty
            listeners.forEach(function (item) {
                item("...");
            });
        }
    };
})();
main.pagination.init = function () {
   $('ul li').click(function () {
      main.pagination.event.publish();
   };
};

main.update.init = function() {
    var event = main.pagination.event.subscribe(main.update.listener);
};

main.update.listener = function (tbl) {
   alert(tbl);
};

感谢您的帮助。

Answer 1

它是空的，因为您在 publish 之后调用 subscribe listeners 数组中不包含任何内容。只需像这样更改调用顺序

main.update.listener = function (tbl) { alert(tbl); }; main.pagination.init = function () { $('ul li').click(function () { main.pagination.event.publish(); }; }; main.update.init = function() { var event = main.pagination.event.subscribe(main.update.listener); }; main.update.init(); // invoke subscribe first to add the listener to the array main.pagination.init();

JS观察者模式

JS observer pattern

javascript

observer-pattern