一、Vue 生命周期
1.beforeCreate(创建前)
数据观测和初始化事件还未开始
2.Create(创建后)
完成数据观测，属性和方法的运算，初始化事件，$el属性还没有显示出来
3.beforeMounted(挂载前)
在挂载之前被调用，相关的render函数首次被调用，实例完成以下配置:编译模板，把data里面的数据和模板生成html。此时还没有挂html到页面上。
4.mounted(挂在后)
在el被新建的vm.$el替换，并挂载到实例上去之后被调用。实例已完成以下配置:用上面编译好的html内容替换el属性指向的DOM对象。完成模板中的html渲染到html页面中。此过程中进行ajax交互。
5.beforeUpdate(更新前)
在数据更新之前调用，发生在虚拟DOM重新渲染和打补丁之前。可以在该钩子中进一步地更改状态，不会触发附加的重新渲染过程。
6.updated(更新后)
在由于数据更改导致的虚拟DOM重新渲染和打补丁之后调用。调用时，组件DOM已经更新，所以可以执行依赖DOM的操作。然而在大多数情况下，应该避免在此期间更改状态，因为这可能会导致更新无限循环。该钩子在服务器端渲染期间不被调用。
7.beforeDestory(销毁前)
在实例销毁之前调用。实例仍然完全可用。
8.destoryed(销毁后)
在实例销毁之后调用。调用后，所有事件监听会被移除，所有的子实例也会被销毁。该钩子在服务器端渲染期间不被调用。
二、子组件和父组件执行顺序
加载渲染过程
1.父组件beforeCreate()
2.父组件created()
3.父组件beforeMounte()
4.子组件beforeCreate()
5.子组件created()
6.子组件beforeMounte()
7.子组件mounted()
8.父组件mounted()
更新过程
1.父组件beforeUpdate()
2.子组件beforeUpdate()
3.子组件updated()
4.父组件updated()
销毁过程
1.父组件beforeDestory()
2.子组件beforeDestory()
3.子组件destoryed()
4.父组件destoryed()
三、Vue计算属性与普通属性的区别
computed(计算属性)
定义：是数据层到视图层的数据转化映射
计算属性是基于他们的依赖进行的缓存，只有在相关依赖发生改变时，他们才会重新求值，也就是说，只要他们的依赖没有发生变化，那么每次访问的时候计算属性都会立即返回之前的计算结果，不再执行函数；
计算属性与普通属性的区别：
1.计算属性是响应式的，methods并非响应式；
2.调用方式不一样，computed定义的成员像属性一样访问，而method定义的成员必须以函数的形式调用。
3.computed.是带缓存的，只有依赖的数据发生改变的时候，才会重新计算，而methods里面的函数在每次调用时都要执行。
4.computed中的成员可以只定义一个函数作为只读属性，也可以定义get/set变成可读属性，这点methods中的成员做不到。
5.computed不支持异步，当computed内有异步操作时无效，无法监听数据变化。
四、下面关于Vue说法正确的是？ CD
A.data中某一属性的至发生改变后，视图会立即同步进行重新渲染
B.Vue实例创建后再添加的属性，该属性改动将不会触发视图更新
C.计算属性只有在它的相关依赖发生改变时才会重新求值
D.Vue组件的data选项必须是函数
答案解析：
A.data中某一属性的至发生改变后，视图不会立即同步进行重新渲染
Vue实现响应式并不是数据发生变化之后DOM立即变化，而是按一定的策略进行DOM的更新。
Vue在更新DOM时是异步执行的。只要侦听的数据变化，Vue将开启一个队列，并缓存在同一事件循环中发生所有数据变更。
如果同一个Watcher被多次出发，指挥被推入到队列中一次，这种在缓存时去除重复数据对于避免不必要的计算和DOM操作时非常重要的。
然后，在下一个的时间循环"tick"中，Vue刷新队列并执行实际(已去重的)工作。
Vue基本原理
1.当我们把对象传入Vue实例作为data选项，Vue会遍历此对象所有的property，并使用Object.defineProperty把这些property全部转化为getter/setter.并且在内部追踪相关依赖，在属性被访问和修改时通知变化。
2.每个组件实例都对应一个watcher实例，它会在组件渲染过程中把"接触"过的数据property记录为依赖，
3.当data的某一值发生改变之后，就会触发实例setter,同时通知watcher重新计算,使它关联的组件重新渲染视图
D.
1.Object是引用数据类型,如果不用函数 返回,每个组件的data 都是内存的同一个地址,一个数据改变了其他也改变了;
2.javascipt只有函数构成作用域(注意理解作用域,只有函数的{}构成作用域,对象的{}以及if(){}都不构成作用域)，data是一个函数时，每个组件实例都有自己的作用域，每个实例相互独立,不会相互影响。
五、子组件可以直接改变父组件的数据么，说明原因
不可以
原因：主要是为了维护父子组件的单向数据流。
每次父组件发生更新时，子组件所有的prop都将会刷新为最新值。
如果这样做了，Vue会在浏览器的控制台发出警告。
Vue提倡单向数据流，即父级props的更新会流向子组件，但是反过来则不行，这是为了防止意外的改变父组件状态，使得应用的数据流变得难以理解，导致数据流混乱。如果破坏了单项数据流，当应用复杂时，debug的成本非常高。
只能通过$emit派发一个自定义事件，父组件接收到后，由父组件修改。
六、Vue2.0与Vue3.0对比
1.Vue3 beta新优势
1.Object.defineProperty与Proxy对比
Object.defineProperty缺点:
a.无法对原声数组进行更新;
b.对象嵌套时，递归消耗部分性能；
c.无法对新添加的属性进行监听
Proxy解决：
a.支持监听原声数组;
b.Proxy的获取数据，只会递归到需要获取的层级，不会继续递归；
c.可对新添加的属性监听;
七、虚拟DOM，虚拟DOM要做什么？虚拟DOM本身是什么？
八、Vue的两大核心
1.数据驱动
数据双向绑定
Vue 响应式核心就是，getter 的时候会收集依赖，setter 的时候会触发依赖更新
vue将遍历data中对象的所有property，并使用Object.defineProperty把这些 property 全部转为getter/setter。
这些 getter/setter 对用户来说是不可见的，但是在内部它们让 Vue 能够追踪依赖，在 property 被访问和修改时通知变更。
每个组件实例都对应一个 watcher 实例，它会在组件渲染的过程中把“接触”过的数据 property 记录为依赖。
getter 的时候我们会收集依赖，依赖收集就是订阅数据变化watcher的收集，依赖收集的目的是当响应式数据发生变化时，能够通知相应的订阅者去处理相关的逻辑。
setter 的时候会触发依赖更新，之后当依赖项的 setter 触发时，会通知 watcher，从而使它关联的组件重新渲染。
2.组件系统
优点：降低数据之间的耦合度 ---->低耦合
可重用性
组件的核心选项
a.模板（template）：模板声明了数据和最终展现给用户的DOM之间的映射关系。
b.初始数据（data）：一个组件的初始数据状态。对于可复用的组件来说，这通常是私有的状态。
c.接受的外部参数(props)：组件之间通过参数来进行数据的传递和共享。
d.方法（methods）：对数据的改动操作一般都在组件的方法内进行。
d.生命周期钩子函数（lifecycle hooks）：一个组件会触发多个生命周期钩子函数，最新2.0版本对于生命周期函数名称改动很大。
e.私有资源（assets）：Vue.js当中将用户自定义的指令、过滤器、组件等统称为资源。一个组件可以声明自己的私有资源。私有资源只有该组件和它的子组件可以调用。
九、Vue常用修饰符
1.v-model修饰符
a. .lazy
在默认情况下，v-model 在每次 input 事件触发后将输入框的值与数据进行同步 。你可以添加 lazy 修饰符，从而转变为使用 change 事件进行同步
b. .trim
自动过滤用户输入的首尾空白字符
c. .number
自动将用户的输入值转为数值类型
2.事件修饰符
a. .stop
阻止事件冒泡
b. .prevent
阻止默认行为
c. .self
只有元素本身触发时才触发方法，就是只有点击元素本身才会触发，变相阻止事件冒泡
d. .once
事件只能用一次，无论点击几次，执行一次之后都不会再执行
e. .capture
事件的完整机制是捕获-目标-冒泡，事件触发是目标往外冒泡
f. .sync
对prop进行双向绑定
3.按键修饰符
.keyCode：监听按键的指令
全部的按键别名：
.enter
.tab
.delete(捕获“删除”和“退格”键)
.esc
.space
.up
.down
.left
.right
4.系统键修饰符
.ctrl
.alt
.shift
.meta
十、Vuex
是一个专为Vue.js应用程序开的状态管理模式，它采用集中式存储管理应用的所有组件的状态，并以相应的规则保证状态以一种可预测的方式发生变化。Vuex用于组件之间的传值。
1.核心流程中的主要功能：
a.Vue compontents是我们的Vue组件，组件会触发dispatch一些事件或动作，也就是视图中actions.
b.我们在组件中发出的动作，肯定是想获取或改变数据的，但是在Vuex中，数据是集中管理的，我们不能直接更改数据，所以会把这个动作提交到Mutations中；
c.然后Mutations就去改变Mutate State中的数据；
d.当State中的数据被改变之后，就会重新渲染render到组件中去，组件战事后更新数据，完成一个流程。
2.各模块在核心流程中的主要功能：
a.Vue Components: Vue组件。Htm页面上，负责接收用户操作等交互行为，执行dispatch方法触发对应的action进行回应。
b.dispatch：操作行为触发方法，是唯一能执行actions。
c.actions：操作行为处理模块。负责处理Vue Components接收到的所有交互行为。包含同步/异步操作，支持多个同名方法，按照注册的顺序依次触发。向后台API请求的操作就在这个模块中进行，包括触发其他action以及mutation的操作。该模块触发其他action以及提交mutation的操作。该模块提供promise的封装，以支持action的链式触发。
d.commit：状态改变提交操作方法。对mutation进行提交，是唯一能执行mutation的方法。
e.mutations：状态改变操作方法。是Vue修改state的唯一推荐方法，其他修改方式在严格模式下将会报错。该方法只能进行同步操作，且方法名只能全局唯一。操作之中会有一些hook暴露出来，以进行state监控等。
f.state：页面状态管理容器对象。集中存储Vue Components中data对象的零散数据，全局唯一，以进行统一的状态管理。页面显示所需的数据从该对象中进行读取，利用Vue的细粒度数据相应机制来进行高校的状态更新。
g.getters:state对象的读取方法。途中没有单独列出来该模块，应该被包含在了render中，Vue Conponents通过该方法读取全局state.
十一、数据之间通信
十二、Vue Router
1.实现原理:更新视图并不会重新请求页面
2.路由模式：
a.hash模式
默认时hash模式，基于浏览器history api,使用window.addEventListener("hashchange",callback, false)对浏览器地址进行监听。当调用push时，把新路由添加到浏览器访问历史栈顶。使用replace时，把浏览器访问历史的栈顶路由替换成新路由。
hash值等于url中#及其后面的内容。浏览器是根据hash值的变化，将页面加载到相应的DOM位置。描点变化只是浏览器的行为，每次描点变化后依然会在浏览器中留下一条历史记录，可以通过浏览器的后退按钮回到上一个位置。
b.history模式
基于浏览器history api,使用window.onpopstate对浏览器地址进行监听。对浏览器history api中的pushState()、replaceState()进行封装，当方法调用，会对浏览器历史栈进行修改。从而实现URL的跳转而无需重新加载页面。
但是它的问题在于当刷新页面的时候会走后端路由，所以需要服务端的辅助来兜底，避免URL无法匹配到资源时能返回到页面。
c.abstract模式
不涉及和浏览器地址的相关记录。流程跟hash模式一样，通过数组维护模拟浏览器的历史纪录栈。
服务端下使用，使用一个不依赖于浏览器的浏览历史虚拟管理后台。
总结：hash和history都是通过window.addEventListener()方法监听hashchange和popState进行相应路由的操作。可以通过back、foward、go等方法访问浏览器的历史纪录栈，进行各种跳转。而abstract模式时自己维护一个模拟的浏览器历史记录栈的数组。
3.Vue-router的动态路由？获取传过来的参数？
实现方式：
a.param方式
配置路由格式:/router/:id
传递的方式:path后面跟上对应的值
传递后形成的路径:/router/123
b.query方式
配置路由格式:/router,也就是普通配置
传递的方式：对象中使用query的key作为传递方式
传递后形成的路径:/router?id=123
