手写eventBus事件总线

Posted 幸福是奋斗出来的

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了手写eventBus事件总线相关的知识,希望对你有一定的参考价值。

注册一个全局的事件总线,来处理页面/组件间的通信

class EventBus{
            constructor() {
               this.events = {}
            }
            $on(name,listener) {
                if(!name || !listener)return;
                if(Array.isArray(name)){
                    for(let i = 0; i < name.length; i++){
                        this.$on(name[i],listener);
                    }
                }else{
                    if(!this.events[name]){
                        this.events[name] = []
                    }
                    this.events[name].push(listener); 
                }
            }
            $emit(name) {
                if(!this.events)return;
                let args = Array.prototype.slice.call(arguments, 1);
                for(let key in this.events){
                    if(this.events.hasOwnProperty(key) && key === name) {
                        const listener = this.events[name];
                        if(!listener)return;
                        for(let i = 0;i<listener.length;i++){
                            if(typeof listener[i] === \'function\') {
                                listener[i](...args);
                            }
                        }   
                    }
                }
            }
            $once(name, listener) {
                if(!name || !listener)return;
                const that = this;
                const _listener = function(){
                    listener.apply(that,arguments);
                    that.$off(name);
                }
                this.$on(name, _listener);
            }
            $off(name) {
                if(!this.events || !name)return;
                if(Array.isArray(name)) {
                    for(let i = 0; i < name.length; i++) {
                        this.$off(name);
                    }
                }else{
                    if(this.events[name]){
                        delete this.events[name];
                    }
                }
            }
        }

以上是关于手写eventBus事件总线的主要内容,如果未能解决你的问题,请参考以下文章

事件总线EventBus使用详解

android事件总线(eventbus)设计与实现

EventBus事件通信框架 ( 总结 | 手写事件通信框架完整代码示例 | 测试上述框架 )

EventBus 事件总线 简介 案例

Android EventBus事件总线剖析

手动实现事件总线框架EventBus