js 自定义事件

自定义事件很难派上用场？

为什么自定义事件很难派上用场，因为以前js不是模块化开发，也很少协作。因为事件本质是一种通信方式，是一种消息，只有存在多个对象，多个模块的情况下，才有可能需要用到事件进行通信。而现在有了模块化之后，已经可以使用自定义事件进行各模块间协作了。

哪里用得到自定义事件？

事件本质是一种消息，事件模式本质上是观察者模式的实现，那么用得上观察者模式的地方，自然也可以也可以用上事件模式。所以，如果：

1、一个目标对象改变，需要多个观察者调整自身的。

比如：我需要元素A点击之后，元素B显示鼠标的位置，元素C显示提示,元素D.....

2、分模块协作需要解耦的

比如：甲负责模块A，乙负责模块B，模块B需要A运行完之后才能运行

传统的写法将逻辑写在一个方法里面：

function doSomething(){
A();
B();
}

这样做每次扩展都要修改a的点击函数，不好扩展。

自定义事件的写法

//1、创建事件
var clickElem = new Event("clickElem");

//2、注册事件监听器
elem.addEventListener("clickElem",function(e){
//干点事
})

//3、触发事件
elem.dispatchEvent(clickElem);

可以看到，

elem

通过

dispatchEvent

方法触发的事件，只有

elem

上注册的监听器才能监听得到。这就很没意思了，自己发给自己消息，通知自己去干什么。

创建自定义事件可参考： MDN : Creating_and_triggering_events