自定义事件订阅和发布

一个基于ES6 class的事件订阅类方法，可以实现自定义事件订阅、触发和取消订阅：

class Public {
    constructor() {
        this.handlers = {}
    }
    // 订阅事件
    on = function (eventType, handler) {
        if (!(eventType in this.handlers)) {
            this.handlers[eventType] = [];
        }
        this.handlers[eventType].push(handler);
        return this;
    }
    // 触发事件(发布事件)
    emit = function (eventType) {
        let handlerArgs = Array.prototype.slice.call(arguments, 1);
        if (this.handlers[eventType]) {
            for (let i = 0; i < this.handlers[eventType].length; i++) {
                this.handlers[eventType][i].apply(this, handlerArgs);
            }
        }
        return this;
    }
    // 删除订阅事件
    off = function (eventType, handler) {
        let currentEvent = this.handlers[eventType];
        let len = 0;
        // console.log(currentEvent)
        if (currentEvent) {
            len = currentEvent.length;
            // console.log(len)
            for (let i = len - 1; i >= 0; i--) {
                if (currentEvent[i] === handler) {
                    // console.log(currentEvent)
                    currentEvent.splice(i, 1);
                }
            }
            if (currentEvent.length == 0) {
                delete this.handlers[eventType]
            }
        }
        return this;
    }
}

// 测试代码
let Publisher = new Public();
let fn = (fn) => {
    console.log(fn)
}
let fn1 = (fn) => {
    console.log(fn,'哈哈哈哈哈')
}
// 订阅事件a
Publisher.on('a', fn);
Publisher.on('a', fn1);
// 触发事件a
Publisher.emit('a', '我是第1次调用的参数');
//取消事件a的绑定方法fn
Publisher.off('a', fn);
Publisher.emit('a', '我是第2次调用的参数');　

测试结果：

VM322:2 我是第1次调用的参数
VM322:6 我是第1次调用的参数 哈哈哈哈哈
VM322:6 我是第2次调用的参数 哈哈哈哈哈