【Javascript】实现事件管理器

少女dtysky

世界Skill

时刻2016.07.01

描述如何在Js中事件事件管理器,在别的语言中也差不多。


在Js中实现事件机制,可以用以下的一个类(ES6写法)实现。这是一个事件管理器,包含了注册、解除注册、发送事件三个功能,这三个功能一般足以满足轻量的事件驱动需求。

事件驱动器核心是一个hash table_events,他的键是事件名称,值是一个由方法构成的数组。
register函数用于注册事件,新建事件或者向事件中添加方法;unregister解除注册,从事件中移除方法或者自动移除事件;dispatch方法通过事件的名字执行事件,按照注册的顺序顺序执行。

class EventManager{
    constructor(){
        this._events = {};
    }

    register(event, method){
        if(this._events[event] === undefined){
            this._events[event] = [];
        }
        this._events[event].push(method);
    }

    unregister(event, method){
        if(this._events[event] === undefined){
            throw new NoEventException(
                `Can not unregister method, the event named "${event}" is not existed!`
            );
        }
        const index = this._events[event].indexOf(method);
        if(index === -1){
            throw new NoEventException(
                `Can not unregister method, the method named "${method}" is not in event "${event}"!`
            );
        }
        this._events[event].splice(index, 1);
        if(this._events[event].length === 0){
            delete this._events[event];
        }
    }

    dispatch(event){
        if(this._events[event] === undefined){
            throw new NoEventException(
                `Can not dispatch event, the event named "${event}" is not existed!`
            );
        }
        this._events[event].map(
            method => {
                method();
            }
        );
    }
}

如果不是自己的创作,少女是会标识出来的,所以要告诉别人是少女写的哦。