在前端开发中，我们经常会给元素绑定事件。但恐怕对javascript本身事件机制没有太深的关注。
在浏览器事件相关的API中，主要有三个接口：
- Event
- EventTarget
- EventListener
以上的三个接口就足以完成一个事件的创建，监听，以及派发。
// 创建事件
const event = new Event('foo');
// 事件监听
const eventListener= function (e) {console.log(e.detail)};
elem.addEventListener('foo', eventListener, false);
// 派发事件
elem.dispatchEvent(event);
在上面的例子当中：
- elem 代表EventTarget，你可以为他添加事件
addEventListener，移除事件removeEventListener，或者派发事件dispatchEvent。大部分情况下是HTML节点，但也可以是其他的对象比如XHR - event 自然就是指我们创建的Event。他不仅仅是指定了事件的名字。还可以添加其他信息：
const event = new CustomEvent('build', { detail: '定制信息' });
上边的CustomEvent是Event的子接口。事实上event有很多子接口：
- 最后，变量eventListener 指实现了EventListener的对象，能够处理其对应的事件。一般而言就是普通函数。
总结一下，一个事件的生命周期有一个主体（EventTarget），一般而言就是HTML节点，可以使用addEventListener为该主体绑定事件（Event）与处理函数（EventListener）。最终实现事件的绑定与派发。
