手撸JS事件总线

class EventEmitter {
    eventArr = [];//事件列表
    useFunArr = [];//添加的中间件列表
    eventTpl = {
        name: "", //事件名
        isOnce: false, //是否只执行一次
        //回调
        callback: function () {

        }
    }

    constructor() {

    }

    createEvent(name, callback) {
        return {
            name: name, //事件名
            isOnce: false, //是否只执行一次
            callback: callback //回调
        }
    }

    getEvent(name, fn) {
        let matchFn = fn && typeof fn == 'function';
        return this.eventArr.filter((e) => {
            let b = e.name === name;
            if (matchFn) {
                b = b && e.fn === fn;
            }
            return b;
        })
    }

    removeEvent(name, fn) {
        let matchFn = fn && typeof fn == 'function';
        this.eventArr = this.eventArr.filter((e) => {
            let b = e.name === name;
            if (matchFn) {
                b = b && e.fn === fn;
            }
            console.log('off----',b)
            return !b;
        })
    }

    /**
     * 中间件过滤, 只有添加的中间件执行next(),
     * 才会触发下一个中间件,
     * 否则终止触发事件
     * @param {String} name 触发事件名
     * @param {Object} packet 触发事件传入的数据
     * @return {boolean} b
     */
    useFilter(name, packet) {
        let useFunArr = this.useFunArr;
        let len = useFunArr.length;
        let index = 0;
        if (len) {
            //从第一个中间件开始执行
            useFunArr[0](name, packet, next);
            //执行过的中间件与中间件总数相比较
            if (index === len - 1) {
                return true;
            } else {
                return false;
            }
        }
        return true;

        function next() {
            //每执行一个中间件,指数+1
            index++;
            if (index < len) {
                useFunArr[index](name, packet, next);
            }
        }


    }

    use(fn) {
        console.log(`event-use ${name}`)
        this.useFunArr.push(fn);
    }

    off(name, fn) {
        console.log(`event-off ${name}`)
        this.removeEvent(name, fn);
    }

    on(name, fn, cover = false) {
        console.log(`event-on ${name}`)
        let ev = this.createEvent(name, fn);
        if (cover) {
            // @ts-ignore
            let eventArr = this.getEvent(name);
            if (eventArr.length > 0) {
                // @ts-ignore
                this.removeEvent(name);
            }
        }
        this.eventArr.push(ev);
        return ev;
    }

    once(name, fn, cover = false) {
        console.log(`event-once ${name}`)
        let ev = this.on(name, fn, cover);
        ev.isOnce = true;
    }

    emit(name, data) {
        console.log(`event-emit ${name}:${data}`)
        // @ts-ignore
        let eventArr = this.getEvent(name);
        let b = this.useFilter(name, data);
        if (!b) {
            return;
        }
        let len = eventArr.length,
            ev;
        for (let i = 0; i < len; i++) {
            ev = eventArr[i];
            //执行监听的事件
            if (typeof ev.callback === 'function') {
                let b = ev.callback(data);
                if (ev.isOnce) {
                    // @ts-ignore
                    this.off(name,ev.fn);
                }
                if (typeof b != 'undefined' && b === false) {
                    return;
                }
            }
        }
    }
}