vue较深入的知识点

1 理解何为虚拟节点

虚拟dom是什么？

虚拟dom就是通过js对象来模拟描述dom树，包括tag，attr, children等属性来代表标签名，属性，子元素等。由于不需要有操作dom的方法，所以比真实的dom轻量很多。
vue虚拟dom是依赖于一个开源库snabbdom.js来扩展实现的。
，映射到真实的 DOM 实际上要经历 VNode 的 create、diff、patch 等过程。

为什么vue要使用虚拟dom？

1.直接频繁的操作真实的dom引起浏览器重排重绘，性能不好。虚拟dom可以通过diff算法快速的计算出变动的地方，有针对性的修改真实的dom。
2.实现数据映射到视图
3.虚拟dom是js对象描述的，可以跨平台应用，而真实的dom只能在浏览器被识别。

2 vue的数据驱动

Vue.js 一个核心思想是数据驱动。所谓数据驱动，是指视图是由数据驱动生成的，我们对视图的修改，不会直接操作 DOM，而是通过修改数据。它
相比我们传统的前端开发，如使用 jQuery 等前端库直接修改 DOM，大大简化了代码量。
特别是当交互复杂的时候，只关心数据的修改会让代码的逻辑变的非常清晰，因为 DOM 变成了数据的映射，我们所有的逻辑都是对数据的修改，而不用碰触 DOM，这样的代码非常利于维护。

3 vue的数据渲染到视图的过程

compile将template模板render为vnode，通过patch生成为真实的dom

4 说说vue的生命周期

每个 Vue 实例在被创建之前都要经过一系列的初始化过程。例如需要设置数据监听、编译模板、挂载实例到 DOM、在数据变化时更新 DOM 等。
同时在这个过程中也会运行一些叫做生命周期钩子的函数，给予用户机会在一些特定的场景下添加他们自己的代码。

beforeCread钩子是在vue初始化数据之前调用的，此时取不到props data等值
created 钩子是在vue初始化数据和监听函数之后调用的，此时能拿到props data等值。
beforeMount 是在render渲染vvnode之前调用的，此时未挂载到$el上。
mounted 是在渲染完vnode，得到真实dom并挂载到$el身上后调用的，此时能拿到真实的dom
beforeUpdate 是实例的数据发生变化，未渲染到页面之前调用的。
updated是数据发生变化并完成视图更新后调用的
beforeDestroy 组件销毁之前调用
destroyed 组件销毁之后调用的，此时已经注销掉所有监听事件和数据，但是页面的真实dom依旧保留着。

5 深入vue的响应式原理

响应式对象，核心就是利用 Object.defineProperty 给数据添加了 getter 和 setter。
目的就是为了在我们访问数据以及写数据的时候能自动执行一些逻辑：getter 做的事情是依赖收集，setter 做的事情是派发更新。

6 说说nextTick

vue的据的变化到 DOM 的重新渲染是一个异步过程，发生在下一个 tick。所以一旦我们想要获取到数据变化后的dom，需要在vm.$nextTick()之后去获取

7 computed 和watch 有什么区别

计算属性本质上是 computed 加 watcher，而侦听属性本质上是 user watcher。
就应用场景而言，计算属性适合用在模板渲染中，某个值是依赖了其它的响应式对象甚至是计算属性计算而来；而侦听属性适用于观测某个值的变化去完成一段复杂的业务逻辑。