这个文章介绍如何实现 vue的$on $emit $once $off 。 不懂$on $emit $once $off都是干什么的  直接 去看VUEapi  传送门 https://cn.vuejs.org/v2/api/#vm-on

当前vue的$on $emit $once $off 具体是什么实现的，我没读vue源码，只是前段时间 上班实在没活干，就看设计模式，突然发现订阅模式，很适合写这个，就自己写了一个。

以下实现代码 均在 (function(win){// ...})(window)里面。为了避免作用域咯。

let eventList = {}      // 这个对象是保存事件。

可以看一下实现的时候eventList对象里面就是这样的

思路是  当我们$on('aaa', argu => {xxxxx}) 的时候 先在eventList对象里面看有没有属性名为aaa的数组，没有的话 就创建一个，然后吧$on第二个参数的函数 保存在aaa数组里面，如果有aaa数组，那么我们就直接吧第二参数的函数，push进去。

当我们$emit('aaa', 'argument')的时候 我们去在eventList对象里面去找属性名为aaa的数组，如果没找到就直接退出终止执行，如果找到了aaa数组，那么就循环里面的函数，然后吧第二参数，放在数组里面的每一项函数里面执行一遍。

大概思路就是上面那样，其实自定义事件也是这么玩的。   下面我就截图以下具体实现代码

记住哈，我们需要先定义一个  let eventList = {} 的对象 用来保存

---

80行的for循环看不懂 你就 onFunction.forEach(fn, () => {fn.apply(this, arguments)})

别问我为什么不这么写，我也不知道当初为什么脑抽 装了一个逼，非用for循环写了

---

还记得吗？我们以上的代码都在 (function(win){// ...})(window)里面

所以 还需要win.$on = $on win.$emit = $emit win.$once = $once win.$off = $off 把这些东西暴露在window上

好了，你可以测试一下  以上代码

这个是我自己测试的，你可以随便测试哈

---