发布订阅模式

最新推荐文章于 2025-07-17 12:53:55 发布

原创最新推荐文章于 2025-07-17 12:53:55 发布 · 130 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#javascript

本文介绍了JavaScript中的发布订阅模式，通过示例展示了如何订阅、发布事件以及解除订阅。使用`Event.listen`、`Event.trigger`和`Event.remove`方法，可以实现不同模块间的通信，提高代码的解耦性。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

// 发布订阅模式
let Event = (function(){
    let eventList = {},
        listen,
        trigger,
        remove;

    listen = function(key,fn){//订阅
        (eventList[key] || (eventList[key] = [])).push(fn)
    };

    trigger = function(key,fn){//发布
        if(!eventList[key]) return
        eventList[key].forEach(item => {
            item.call(this,fn)
        });
    };

    remove = function(key,fn){//解除订阅
        var fns = eventList[key];
        if(!fns) return
        if (!fn){
            fns && (fns.length = 0)
        }else{
            for(var j=fns.length-1;j>=0;j--){
                if(fn===fns[j]){
                    fns.splice(j,1);
                }
            }
        } 
    };

    return {
        listen:listen,
        trigger:trigger,
        remove:remove
    }
})();


Event.listen('big', fn1 = function(val){console.log('价格是'+ val + '元')})//李某某的订阅
Event.listen('big', fn2 = function(val){console.log('数量是'+ val + '个')})//张某某的订阅
Event.remove('big',fn2)//解除张某某订阅
Event.trigger('big', 20000)//发布