eventBus原理

function eventBusClass () {
    this.msgQuenes = {}
}

eventBusClass.prototype = {
    on: function(msgName, func){
        // 1. 判断当前队列里边是否包含msgName
        if (this.msgQuenes.hasOwnproperty(msgName)) {
            // 2. 判断当前 是否为函数，不为函数的使用场景如最下边
            if (typeof this.msgQuenes[msgName] === 'function') {
                // 3. 若是，则和上一次的一起放进一个数组里边
                this.msgQuenes[msgName] = [this.msgQuenes[msgName], func]
            } else {
                // 4. 若不是，证明进行了多次订阅，直接往数组里边添加
                this.msgQuenes[msgName] = [...this.msgQuenes[msgName], func]
            }
        } else {
            // 5. 若不包含直接添加
            this.msgQuenes[msgName] = func 
        }
    },
    once: function(msgName, func){
        this.msgQuenes[msgName] = func
    },
    emit: function(msgName, msg){
        if (!this.msgQuenes.hasOwnproperty(msgName)) return
        if (typeof this.msgQuenes[msgName] === 'function') {
            // 1
            this.msgQuenes[msgName](msg)
        } else {
            // 2 数组进入
            this.msgQuenes[msgName].map(fn => {
                fn()
            })
        }
    },
    off: function(msgName){
        if (!this.msgQuenes.hasOwnproperty(msgName)) return
        delete this.msgQuenes[msgName]
    }
}

const BUS = new eventBusClass()

/**
 * 例子A：
 *  BUS.on('testA', function a1(){alert(11111)}) 执行on中的5
 *  BUS.on('testA', function a2(){alert(22222)})  执行on中的3
 *  BUS.on('testA', function a3(){alert(33333)}) 执行on中4
 *
 *  BUS.emit('testA', 2222) 执行emit中的 2 else语句
 * 
 * 
 * 例子B：
 *  BUS.on('testB', function a1(){alert(11111)}) 执行on中的5
 *
 *  BUS.emit('testB', 2222) 执行emit中的 1if语句
 *  
 */