我们回顾下从 new Vue 开始它的执行顺序最后我们还是以一道 vue 可能会被问到的面试题作为本章的结束吧~顺手点个赞或关注呗，找起来也方便~你可能会用的上的一个vue功能组件库，持续完善中；1虚拟dom是一个js对象，用对象属性来描述节点，是一层对真实dom的抽象 2因为dom的执行速度远不如js执行速度快，因此将真实的dom抽象成js对象，然后通过算法计算出真正需要更新的节点，从而减少了大量的dom操作 3；React 会创建一个虚拟 DOMvirtual DOM当一个组件中的状态改变时，React 首先会通过 quotdiffingquot 算法来标记虚拟 DOM 中的改变，第二步是调节reconciliation，会用 diff 的结果来更新 DOM高阶组件是重用组件逻辑的；我们前面知道diff算法发生在虚拟DOM上，而虚拟DOM是如何实现的呢实际上虚拟DOM是有一个个虚拟节点组成h函数用来产生虚拟节点vnode虚拟节点有如下的属性 1sel 标签类型，例如 pdiv 2data 标签；从 VNode 的渲染过程可以得知，Vue 的 Diff 算法先进行的是同级比较，然后再比较子节点子节点比较会通过 startIndexendIndex 两个指针进行两两比较，再通过 key 比对子节点如果没设置 key，则会通过遍历的方式匹配节点；Diff算法是虚拟DOM的核心，它用于比较新旧虚拟DOM树之间的差异Vue中使用的是经典的Diff算法，具体包括以下几个步骤1 Walk遍历新旧虚拟DOM树，对比节点，并记录差异2 Update根据差异进行更新如果节点类型不同，直；1都支持服务器端渲染 2都有虚拟dom，组件化开发，都有‘props’的概念，允许父组件往子组件传送数据，都实现webComponent规范 3数据驱动视图 4都有支持native的方案，React的React native，Vue的weex 5构建。

原理在创建Vue实例时，Vue会遍历data选项的属性，利用ObjectdefineProperty为属性添加getter和setter对数据的读取进行劫持getter用来依赖手机，setter用来派发更新，并且在内部追踪依赖，在属性被访问和修改时通知变化每个组件实例会有相应的；如果数据项的顺序改变，vue将不是移动DOM元素来匹配数据项的改变，而是简单地复用此处每个元素，并确保在特定索引下显示已被渲染过的每个元素key属性类型只能是string或number key的特殊属性主要用在虚拟DOM算法，在新旧；key 主要用在 Vue 的虚拟 DOM 算法，在新旧 nodes 对比时辨识 VNodes不指定key时，Vue 会使用一种最大限度减少动态元素并且尽可能的尝试 就地修改复用相同类型元素的算法而使用 key 时，它会基于 key 的变化重新；Vue 的响应式原理还涉及到虚拟 DOM虚拟 DOM 是一个轻量的 JavaScript 对象，它描述了真实 DOM 的结构当数据发生变化时，Vue 会对虚拟 DOM 进行比较，找出需要更新的地方，然后只更新需要更新的部分这种优化机制使得 Vue 应用程序的；4虚拟dom如果有10次更新dom的动作，虚拟dom不会立即操作dom，而是将这10次更新的内容储存起来，通过diff算法，把新的domvue刚构造的虚拟dom和旧的dom可能是页面上现在显示的真实的dom进行对比。

assets文件夹里是静态资源components是放组件router是定义路由相关的配置view视图appvue是一个应用主组件mainjs是入口文件 在组件切换过程中将状态保留在内存中，防止重复渲染DOM，减少加载时间及性能消耗，提高用户；4Vue20开始支持虚拟DOM 但在Vue10中，操作的是真实DOM元素而不是虚拟DOM，虚拟DOM可以提升页面的渲染性能 30描述vuejs的特点 Vue js有以下特点 31在vuejs中如何绑定事件？ 通过在von后跟事件名称=“事件。

很多同学在面试的时候都会被问到vue的虚拟DOM的diff 以及 patch 的过程，如果这vue的源码了解不是很深刻，很难通过面试官的法眼，下面就来用通俗易懂的方式聊一聊Vue的patch过程我们都知道Dom操作是一个特别低性能的事儿；vue和react都是采用diff算法来对比新旧虚拟节点，从而更新节点在vue的diff函数中建议先了解一下diff算法过程在交叉对比中，当新节点跟旧节点 头尾交叉对比 没有结果时，会根据新节点的key去对比旧节点数组中的key，从而找到相应旧节点；优点因为DOM节点在安卓ios端无法识别，只能在浏览器识别，但是虚拟DOM可以被识别，生成原生的应用组件，可以在原生应用上显示React的Diff算法在调用setState方法改变state中的数据状态时，会产生虚拟DOM，为了页面更新提升。