# Vue 面试
# 1. 有哪些生命周期
系统自带： beforeCreate created beforeMount mounted beforeUpdate updated beforeDestroy destroyed
# 2. 一旦进入到页面或者组件，会执行哪些生命周期，顺序。
beforeCreate created beforeMount mounted
# 3. 在哪个阶段有$el，在哪个阶段有$data
beforeCreate 啥也没有
created 有data没有el
beforeMount 有data没有el
mounted 都有
# 4. 如果加入了 keep-alive 会多俩个生命周期
activated、deactivated
# 5. 如果加入了 keep-alive，第一次进入组件会执行哪些生命？
beforeCreate created beforeMount mounted activated
# 6. 如果加入了 keep-alive，第二次或者第 N 次进入组件会执行哪些生命周期？
只执行一个生命周期：activated
# 7. 谈谈你对 keep-alive 的了解
可以从两方面回答：
- 是什么 vue 系统自带的一个组件，功能：是来缓存组件的。===》提升性能
- 使用场景 就是来缓存组件，提升项目的性能。具体实现比如：首页进入到详情页，如果用户在首页每次点击都是相同的，那么详情页就没必要请求 N 次了，直接缓存起来就可以了，当然如果点击的不是同一个，那么就直接请求。
# 8. v-if 和 v-show 区别
可以从两方面回答：
展示形式不同 v-if 是 创建一个 dom 节点 v-show 是 display:none 、 block
使用场景不同 初次加载 v-if 要比 v-show 好，页面不会做加载盒子 频繁切换 v-show 要比 v-if 好，创建和删除的开销太大了，显示和隐藏开销较小
# 9. 组件通信方式
很简单两张图
)
# 10. 再说一下 Computed 和 Watch
Computed本质是一个具备缓存的 watcher，依赖的属性发生变化就会更新视图。
适用于计算比较消耗性能的计算场景。当表达式过于复杂时，在模板中放入过多逻辑会让模板难以维护，可以将复杂的逻辑放入计算属性中处理。
Watch没有缓存性，更多的是观察的作用，可以监听某些数据执行回调。当我们需要深度监听对象中的属性时，可以打开 deep：true 选项，这样便会对对象中的每一项进行监听。这样会带来性能问题，优化的话可以使用字符串形式监听，如果没有写到组件中，不要忘记使用 unWatch 手动注销哦。
# 11. 组件中的 data 为什么是一个函数
v-model 本质就是一个语法糖，可以看成是 value + input 方法的语法糖。 可以通过 model 属性的 prop 和 event 属性来进行自定义。原生的 v-model，会根据标签的不同生成不同的事件和属性。
# 12. 虚拟 Dom 以及 key 属性的作用
由于在浏览器中操作 DOM 是很昂贵的。频繁的操作 DOM，会产生一定的性能问题。这就是虚拟 Dom 的产生原因。
Vue2 的 Virtual DOM 借鉴了开源库 snabbdom 的实现。
Virtual DOM 本质就是用一个原生的 JS 对象去描述一个 DOM 节点。是对真实 DOM 的一层抽象。(也就是源码中的 VNode 类，它定义在 src/core/vdom/vnode.js 中。)
VirtualDOM 映射到真实 DOM 要经历 VNode 的 create、diff、patch 等阶段。
「key的作用是尽可能的复用 DOM 元素。」
新旧 children 中的节点只有顺序是不同的时候，最佳的操作应该是通过移动元素的位置来达到更新的目的。
需要在新旧 children 的节点中保存映射关系，以便能够在旧 children 的节点中找到可复用的节点。key 也就是 children 中节点的唯一标识。