是什么
- React 的合成事件是 React 提供的一种事件处理系统，用于封装原生 DOM 事件，提供了跨浏览器兼容性的解决方案。
- 合成事件的优点在于它抽象了底层浏览器实现的差异，使得开发者不需要直接操作底层的事件对象，而是使用 React 提供的统一事件对象来处理事件。这样可以保证在不同浏览器和平台下，行为都是一致的，并且方便进行事件的组合、委托和处理。
- React 的合成事件还具有事件冒泡、事件代理、事件委托等功能。
- 减少了内存消耗，提升了性能。
- 总的来说，React 的合成事件是 React 框架中用于处理 DOM 事件的一套封装系统，它简化了事件处理的复杂性，提高了开发效率，同时保证了跨浏览器兼容性。
- React 上注册的事件最终会绑定在document这个 DOM 上，而不是 React 组件对应的 DOM，这减少了内存开销。
特点
- 执行顺序：会先执行原生事件，然后处理 React 事件，最后执行 document 上挂载的原生事件。
- event.stopPropagation() 不能阻止原生 DOM 的冒泡行为，因为如上所说，React 上注册的事件最终会绑定在 document 上，所以相当于整个冒泡过程结束这些事件才会执行。（另外这里的event是React的合成事件，event.stopPropagation 不是原生的stopPropagation）
原理
- 合成事件如何冒泡？猜想：最直接的问题是如何找到上层的节点和事件，可以在遍历处理JSX树的时候可以让每个节点记录下自己的父节点。
- 合成事件如何实现捕获阶段触发？猜想：这里的问题是如何找到从根节点到目标节点的路径，其实实现冒泡的过程里已经找到了目标节点到根节点的路径，所以这里需要的反向路径也就有了。
- 合成事件如何实现阻止冒泡？猜想：首先event.stopPropagation是React实现的，不是原生的。至于React的内部实现，可以想简单点，比如event.stopPropagation只是把一个flag变为false，每执行一个事件前都需要检查这个flag，遮掩每次执行完event.stopPropagation就可以将冒泡过程停下了。
参考
chatgpt
vue3js.cn/interview/R…
