React的【事件】相关问题

1. React 为什么有自己的事件系统？
统一管理事件。创建一个兼容全浏览器的事件系统，以此抹平不同浏览器的差异

2. 什么是事件合成?
React 应用中，元素绑定的事件并不是原生事件，而是React 合成的事件，比如 onClick 是由 click 合成，onChange 是由 blur ，change ，focus 等多个事件合成。事件对象也是经过不同的事件插件处理后的。而且事件是统一绑定到顶部容器上的。

3. 如何实现的批量更新？
react对事件处理函数做了统一的处理，设置批处理标识，事件处理函数执行前设置为true，函数执行完后标记为false

4. 事件系统如何模拟冒泡和捕获阶段？
冒泡阶段：开发者正常给 React 绑定的事件比如 onClick，onChange，默认会在模拟冒泡阶段执行。
捕获阶段：如果想要在捕获阶段执行可以将事件后面加上 Capture 后缀，比如 onClickCapture，onChangeCapture。

当触发事件时，react通过dom上的key找到对应的fiber对象，获取到事件。react内部维护了一个事件触发队列，如果是绑定了捕获事件则通过unshift放到队前，而冒泡事件通过push放在队尾。然后会向父级冒泡，继续收集事件。如果在某个处理函数有调用 e.stopPropagation() 会阻止事件在fiber树中冒泡。

5. 如何通过 dom 元素找到与之匹配的fiber？
react在初始化真实dom时会生成唯一的key绑定到dom上，指向fiber对象，fiber对象通过stateNode指向当前dom

6. 为什么不能用 return false 来阻止事件的默认行为？
因为在react中给元素的事件并不是真正的事件处理函数。React 需要一个统一流程去代理事件逻辑，包括 React 批量更新等逻辑，所以对绑定的事件处理函数都做了统一的处理。如果需要阻止事件默认行为使用 e.preventDefault()

7. 事件是绑定在真实的dom上吗？如何不是绑定在哪里？
React 的事件不是绑定在元素上的，而是统一绑定在顶部容器上，在 v17 之前是绑定在 document 上的，在 v17 改成了 app 容器上