八小时实现迷你版vuejs四：实现compile和Directive

这一篇，我们要实现一个事件绑定的功能：

<div @click=“sayHello”></div>

那么为了实现这个功能，我们需要三步：
1. 实现 compileDirectives 方法, 可以从attrs中读取directive的配置，这里称之为 descriptor
2. 实现Directive类
3. 实现一个自定指令： v-on

以 v-on 为例，如果碰到这样一个属性 v-on:click=“hello” 指令的初始化流程如下？
1. 遍历DOM
2. 对其中每一个Element，获取所有的attributes
3. 遍历 attributes，如果name以 v-on 开头，那么就是一个绑定事件的指令，我们把相关的配置都存在 descriptor 中
4. 遍历DOM结束，得到一个 descriptors 列表，其中存放了我们创建directive时需要的所有参数，比如name, value, el 等
5. 在 bind 阶段，遍历 descriptors
6. 对每一个descriptor，创建一个Directive
7. bind 结束，directive 初始化完成。

关于watcher的实现以及如何在directive中监听数据的变动，我们放到下一章来讲。

compileDirectives

在vue v1.0 版本及以前，是通过DOM API直接获取attributes的，并通过对name的匹配来判断是哪一类directive。在vue2中显然是通过virtual DOM的API来做的。

那么我们按照上面的步骤来说，compileDirectives 负责其中 1-4 步，即从attributes中生成一个 descriptors 列表:

const onRE = /^v-on:|^@/
const modelRE = /^v-model/
const textRE = /^v-text/
const dirAttrRE =