js class 实现发布订阅者模式。

订阅发布模式由三部分构成

1：订阅者

2：事件中心

3：发布者

具体实现流程 发布者发布消息给事件中心 事件中心通知所有的订阅者

demo：

小明天天看手机但是有一天突发奇想，想买个报纸看看，于是小明坐上火箭就飞到福利社了，但是到了福利社老板说今天的报纸卖完了，如果想看就订购明天的报纸吧，小明心有不甘但还是订购了明天的报纸，订购完了，就等福利社老板通知我了（传参数），到了明天老板说报纸有了小明欢快的拿到了报纸（收参数）。

这里指，福利社就是事件中心，而订阅者就是小明，而福利社的老板就是发布者。

实现的大致思路就是calss一个构造函数，

1.定义一个object，

2.$on 实现就是第一个参数传入属性名attr，第二个参数就是callback，判断对象里有没有属性没有属性就添加一个并且赋值为数组，然后往数组里push callBack。

3.而$emit第一个参数传入属性名attr ，第二个就是传给$on 的参数，然后循环执行attr对应的数组里的函数，

$off就是循环对应attr的数组的函数然后过滤非当前函数，就相当于把当前函数给删除了。

class Bus {
    constructor() {
        this.message = {} // 消息队列 福利社
    }
    $on(attr, callBacks) {
        // 消息队列有没有这个属性没有直接赋值空数组
        if (!this.message[attr]) this.message[attr] = []
        // 向 message数组当中进行追加传进来的函数。
        this.message[attr].push(callBacks)
    }
    $emit(attr, ...value) {
        // 没有属性返回空数组  
        let item = this.message[attr] || []
        // 便利执行
        for (let i = 0; i < item.length; i++) {
            let fn = item[i]
            // 把emit的参数传给on绑定的函数
            fn(...value)
        }
    }
    $off(attr, callBacks) {
        if (!this.message[attr]) return
        if (!callBacks) {
            // 没有函数直接赋值为空
            this.message[attr] = []
            return
        }
         // 有函数就把对应的数组里的函数给删除
        this.message[attr] = this.message[attr].filter(item => item != callBacks)
    }

}
let that = new Bus()
let fn = (res, b) => {
    console.log(34, res, b) // 34 {a: 34} 456
}

that.$on('aaa', fn)
that.$emit('aaa', {a:34}, 456) 
that.$off('aaa', fn)

console.log(that, that.message)// {aaa: Array(0)}

学习就这这么简单。