new vue 里面具体发生了什么

new Vue()触发了 Vue 应用的初始化过程，包括创建根实例、解析模板、数据响应式处理、渲染和更新视图等。这些过程使得 Vue 能够实现响应式的数据绑定和组件化开发，从而构建出高效且动态的用户界面。

1. Vue 实例的创建： 当你使用 new Vue()时，Vue 会创建一个新的 Vue 实例。这个实例将成为你 Vue 应用的根实例，负责管理应用的状态和行为。
2. 选项合并： Vue 会将用户传入的选项对象（如数据、计算属性、方法、生命周期钩子等）进行合并和处理。这个过程叫做选项合并。
3. 数据响应系统的初始化： Vue 实例会初始化数据响应系统，建立数据的双向绑定关系。这允许视图自动更新，当数据变化时，视图会自动反映这些变化。
4. 模板编译： Vue 支持使用模板来定义视图。在 Vue 实例创建过程中，Vue 会将模板编译成渲染函数。这个函数用于生成虚拟 DOM，它是一个轻量级的 JavaScript 对象，表示真实 DOM 的结构和内容。
5. 虚拟 DOM 的创建： 编译模板后，Vue 会生成一个虚拟 DOM。虚拟 DOM 用于高效地更新真实 DOM，因为它可以在内存中操作，而不必直接操作真实的 DOM 元素。
6. 挂载到真实 DOM： 在这一步，Vue 将虚拟 DOM 渲染为真实 DOM，并将其挂载到指定的 HTML 元素上。这通常是通过 Vue 实例的 el 选项来指定的。
7. 事件监听和组件管理： Vue 实例会监听事件，例如用户的交互操作。同时，它也会维护一个组件树，允许你在根实例中注册和使用组件。Vue 会根据组件的层次关系进行组件的渲染和更新。
8. 生命周期钩子的调用： 在 Vue 实例创建和挂载的过程中，Vue 会调用一系列的生命周期钩子函数，如 beforeCreate、created、beforeMount、mounted 等。这些钩子函数允许你在不同的阶段执行特定的逻辑。