以下では、React合成イベントとJavaScriptネイティブイベントを4つの側面から比較します。
1.イベントの伝播とイベント伝播の防止
ブラウザのネイティブDOMイベントの伝播は、ターゲットオブジェクトがコードピース自体のイベントハンドラ
呼び出しを挿入するイベントキャプチャ段階と、イベントバブリングの3つの段階に分けることができます。
イベントキャプチャは、最初に構造ツリーの最も外側の要素にバインドされたイベントリスナーを呼び出し、次に
ターゲット要素のイベントリスナーが呼び出されるまでそれを内側に呼び出します。e.addEventListener（）の3番目の
パラメーターがtrueに設定されている場合、要素eのキャプチャイベントハンドラーを登録し、イベント伝播の最初の段階で呼び出すことができます。
さらに、イベントキャプチャは普遍的なテクノロジではなく、IE9より前のブラウザでは使用できません。イベントバブリングは
、イベントキャプチャのパフォーマンスとは逆に、ターゲット要素から外側に向かって、内側から外側に向かってイベントを伝播します。
イベントキャプチャはプログラム開発ではほとんど重要ではなく、より致命的な問題はその互換性であることがわかります。したがって、React
の合成イベントはイベントキャプチャを実装していません仅仅支持了事件冒泡机制。このAPI設計手法は
、「28原則」に沿って統一され、簡潔になっています。
ネイティブイベントの伝播を防ぐには、e.preventDefault（）を使用する必要がありますが、このメソッドをサポートしていないブラウザー（IE9より下
）では、e.preventDefault（）のみを使用できます。用 e.cancelBubble = true 来阻止。
React合成イベントでは、e.preventDefault（）のみを使用する必要があります。
合成イベントとは何ですか：
Virtual DOM 在内存中是以对象的形式存在的，如果想要在这些对象上添加事件，就会非常
简单。React 基于 Virtual DOM 实现了一个 SyntheticEvent （合成事件）层，我们所定义的事件
处理器会接收到一个 SyntheticEvent 对象的实例，它完全符合 W3C 标准，不会存在任何 IE 标
准的兼容性问题。并且与原生的浏览器事件一样拥有同样的接口，同样支持事件的冒泡机制，我
们可以使用 stopPropagation() 和 preventDefault() 来中断它。
所有事件都自动绑定到最外层上。如果需要访问原生事件对象，可以使用 nativeEvent 属性。
-
イベントタイプ
React合成イベントのイベントタイプは、JavaScriptのネイティブイベントタイプのサブセットです。 -
イベントバインディングメソッド
受到 DOM 标准的影响，绑定浏览器原生事件的方式也有很多种，具体如下所示。
直接在 DOM 元素中绑定：
<button onclick="alert(1);">Test</button> 在 JavaScript 中，通过为元素的事件属性赋值的方式实现绑定：
el.onclick = e => {
console.log(e); }
通过事件监听函数来实现绑定：
el.addEventListener('click', () => {
}, false);
el.attachEvent('onclick', () => {
});
**相比而言，React 合成事件的绑定方式则简单得多：**
<button onClick={
this.handleClick}>Test</button>
4.イベントオブジェクト
ネイティブDOMイベントオブジェクトは、W3C標準とIE標準では異なります。IEブラウザーの低バージョンでは、を
使用window.eventしてイベントオブジェクトを取得できます。React合成イベントシステムでは、このような互換性の問題はなく、イベント
処理関数で合成イベントオブジェクトを取得できます。