vue 必知必会

1. data 为什么要返回一个函数

返回函数是为了让组件有自己的data对象而不与其它组件共享，加入返回对象的话（对象是按引用地址传递）会造成多组件间共享data数据。

官方解释： data-必须是一个函数
参考学习： Vue 组件 data 为什么必须是函数？ 从原型链的角度去认识：加入组件原型链上的data是对象的话，如果两个实例同时引用一个对象，那么当你修改其中一个属性的时候，另外一个实例也会跟着改。

2. watch 和 computed 的比较

相同处： 如果做的事情是更新其他数据，那其实与把这个要更新的数据项定义成computed是一样的，这个时候用computed更有可读性，虽然技术上讲watch也可以实现。
区别：

1. computed 属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算。主要当作属性来使用。这就意味着只要 a或b 还没有发生改变，多次访问 计算属性的结果会立即返回之前的计算结果，而不必再次执行函数。（computed是用于定义基于数据之上的数据。）
2. watch 一个对象，键是需要观察的表达式，值是对应回调函数。 主要用来监听某些特定数据的变化，从而进行某些具体的业务逻辑操作 （比如调用一个方法，这个是computed做不到也不应该做的。） ；可以看作是 computed 和 methods 的结合体；

官方解释：计算属性和侦听器
参考学习：vue中的computed和watch到底有什么不同？

3. vue 的生命周期

创建：

beforeCreate： 是获取不到data中的数据的，因为数据的初始化在initState中
created：可以访问数据，但组件还没有被挂载，所以看不到

载入:

beforeMount: 创建虚拟Dom
mounted：将虚拟Dom渲染为真实Dom,并渲染数据

更新：

beforeUpdate：数据更新前
updated：更新后

销毁：

beforeDestory：适合移除事件，定时器等，否则可能引起内存泄漏
destoryed：如果有子组件，则也是子组件都递归销毁后才执行组件中农的销毁。

keep-alive独有的生命周期：actived和deactived：
keep-alive 包裹的组件切换的时候，缓存到内存中并执行dectivated函数，命中缓存渲染后会执行actived函数。

4.虚拟Dom

Virtual DOM最主要的是保留了Element之间的层次关系和一些基本属性。
h()函数 和patch函数：
两个阶段：

1. 为虚拟Dom的第一次渲染： 将初次生成的Dom结构挂载到指定的container上面；
2. 使用diff算法对比两个参数的差异，进而更新参数变化的Dom节点。

核心算法：

diff算法：通过新旧两颗树的比较，通过差异去实现局部的更新

参考： 深入理解react中的虚拟DOM、diff算法

5. vue中实现双向数据绑定的原理

采用数据劫持结合发布者-订阅者模式。

1. 实现一个数据监听器Observer： 对数据对象的所有属性监听，变动则通知订阅者
2. 实现一个指令解析Compile： 对所有元素节点的指令进行扫描和解析，根据指令模块替换数据以及绑定相应的更新函数
3. 实现一个watcher： 作为连接Observer和Compile的桥梁，能够订阅并受到每个属性变动的通知，执行指令绑定的相应回调函数，从而更新视图。

（：）

1. 使用Object.defineProperty() 实现数据响应式：铜鼓该函数监听set和get事件
2. Dep类：属性的收集和派发更新操作

6. vuex是什么？怎么使用？

是什么：

是vue生态系统中的状态管理
用于组件间的状态管理：如音乐播放，登录状态，加入购物车等。

使用：

a. store：只用来读取的状态集中存放
b. mutations（同步）：改变状态的方式是提交mutations
c. actions（异步）：异步逻辑封装在actions中