React -- 事件系统

React 中的虚拟DOM是在内存中以对象的形式存在的，因此，在对象上添加事件，就会非常容易。

React给予Virtual DOM实现了一个SyntheticEvent合成事件层，我们所定义的事件处理器会接收到一个SyntheticEvent对象的实例。

合成事件的绑定方式

React事件绑定方式在写法上与原生的HTML事件监听器的属性非常相似，并且含义和处罚的场景也都一致。

例如：

<button onClick={this.handleClick}>Test</button>

仔细观察，我们会发现React的事件写法和DOM0级实践中直接设置HTML标签属性为事件处理器的做法还是有区别的：
1、使用驼峰命名法onClick而不是HTML的onclick
2、props的值可以是任意的，而在HTML中只能是JS代码字符串：οnclick=”handleClick()”

虽然在写法上大同小异，但是React并不会像DOM0那样，将事件处理器直接绑定到HTML元素上。React仅仅是借鉴了这种写法，易于开发者使用。

合成事件的实现机制

在React底层，主要对合成事件做了两件事：事件委派和自动绑定。

1、事件委派

React采用了事件代理机制：不会把事件处理函数直接绑定在真实的节点上，而是把左右节点绑定在结构最外层，使用一个统一的事件监听器，这个监听器维持了一个映射，来保存所有组件内部的事件监听和处理函数。

当组件挂载或卸载时，只是在这个同意的事件监听器上插入或者删除对象。当事件发生时，首先被这个同意的事件监听器处理，然后在映射里找到真正的事件处理函数并调用。

2、自动绑定

（待续）