对Vue的理解
从源码角度来说：它实现了数据响应式，异步更新策略，虚拟dom，组件化机制等等东西，是中国目前最好的
框架。
1.什么是单页面,优缺点
是什么？
就是还有一个页面，然后根据监听路由，当路由发生变化时候去渲染对应的数据，达到局部更新。
优点？
能够局部更新页面，无需刷新整个页面，减轻服务器的压力，达到更小，更快，更高效。
缺点？
不利于seo，搜索引擎获取节点的时候没有对应的dom结构，无法爬取。
2.v-show和v-if的区别
v-show: 通过dom的css属性控制现实和隐藏。
v-if: 通过对dom的增加和删除来控制显示隐藏
3.class和style的动态绑定
class动态绑定
:class="[{'active': isActive }]"
:style="['colorStyle', styleStyle']"
data() {
return {
isActive: true
colorStyle: {
color: red,
backgroundColor: red
}
}
}
4.怎么理解vue的单项数据流
什么是单向数据流?
1.一般是由父组件的值，流向子组件的props。
为什么只能党项数据流？
vue里面不允许子组件直接改变父组件的值，子组件只能通过computed去直接修改父组件之，或者通过emit去发射事件通知父组件自己改变值。
5.computed 和 watch 的区别和运用的场景？
computed: 依赖值更新时，computed的值会重新计算,数据修饰或者复杂的数据生成
watch: 依赖值更新时，进行对应的dom操作或者异步数据请求。
6、直接给一个数组项赋值，Vue 能检测到变化吗？
1.直接赋值数组可以监听，7个方法数组可以监听
2.对数组的某个新索引赋值，或者修改length，无法进行数据拦截，非响应式,vue无法监听到。
解决方法：
vm.items.splice(indexOfItem, 1, newValue)
vm.items.splice(newLength)
7.谈谈对Vue生命周期的理解
8.Vue 的父组件和子组件生命周期钩子函数执行顺序？
// 创建
父beforeCreate
父created
父beforeMount
子beforeCreate
子created
子beforeMount
子mounted
父mounted
// 更新
父 beforeUpdate -> 子 beforeUpdate -> 子 updated -> 父 updated
// 销毁
父 beforeDestroy -> 子 beforeDestroy -> 子 destroyed -> 父 destroyed
9、在哪个生命周期内调用异步请求？
create、beforeMount、mounted 进行异步请求
10、在什么阶段才能访问操作DOM？
mounted阶段可以访问，此时模板已经编译成对应的数据并挂载到dom上了
11.谈谈你对 keep-alive 的了解？
表现出来的就是：第一次页面刷新，组件会被重新渲染，接下来路由切换到该组件下，组件会从缓存中读取。
为什么，节约内存，避免无数据更新组件的多次数据请求和多次渲染
作用：
1.<router-view></router-view> 配合keep-alive，避免组件被多次渲染
12. 组件中 data 为什么是一个函数？
函数的情况是针对谁？
必须是函数的情况只针对组件，跟实例并可以是函数，也可以是对象。
为什么子组件必须但会一个函数
因为组件存在复用的情况，
如果是返回一个对象，那么其他函数使用时候获取的初始值就是一个引用地址。值可能已经受到污染。
如果为函数，就算组件复用了返回的也是一个全新的引用地址，不会相互污染。
13.v-model 的原理
是什么？
对v-model首先是，在vue的内部编译类中解析v-mode指令，替换对应的表达式为domd值，然后再根据input的类型监听对应的事件，比如input、change事件，事件触发则进行去做数据更新
14.Vue 组件间通信有哪几种方式？
1.父组件传子组件
动态绑定 + props
2，子组件传父组件
emit
3.嵌套组件
a. 事件列车 on + emit
b. vuex共享值
15.Vuex
表现：
所有组件能共享值。值有对应api进行同步或异步更新
是什么？
集中式管理组件状态，可预测的数据更新方式。
怎么使用？
state进行值得存储；
getters进行值的修饰和复杂计算
actions进行值得异步请求
mutations进行值得同步修改
16.什么是 MVVM？
M就是模型层，业务逻辑和数据处理，在前端呈现的就是api接口的数据请求
v就是视图层，由html、css，数据和事件绑定构成视图
vm是桥梁，实现数据修改视图更新，事件监听触发视图更新和数据修改
Vue 是如何实现数据双向绑定的
遍历递归组件实例上的data数据然后通过definePrototype拦截每一个数据的get和set方法
a.在拦截前创建数据依赖。
b.在get中进行依赖收集。
c.在set中进行数据更新通知。从而达到数据修改数据更新
complie编译数据
递归遍历所有的dom节点
a.元素节点，将v-指令中的表达式替换为对应的响应数据
b.文本节点，将模板编译中表达式编译成对应的像影视剧
c.同时每次编译时创建一个wather
wather更新器
被依赖器通知时，精准地更新每一个dom的数据
Dep收集器
对所有的数据的更新器进行收集。
新增对象和数组的索引怎么实现响应式。
新增对象：
set方法是复用了definePrototype，get和set进行拦截
新增的数组：
对7个方法进行拦截
数据更新后，dom获取的数据不是最新的
为什么?
vue的视图更新机制：一般都是在本轮事件循环的最后进行一次DOM更新，进行数据更新。特殊情况时
候，把DOM更新放在下一轮的事件循环当中。
解决方法：
用nextTick去执行回调，回调中去获取最新dom中的值或者dom的操作。
`$nextTick`方法将回调延迟到下次DOM更新循环之后执行,这样保证dom拿到的值是最新的
关于nextTick
现象：
我去研究nextTick是基于这种现象：就是我们使用vue的时候，直接修改data值，但是这时候去获取
dom的绑定的data值不会是最新的。本质原因是Vue的一种异步更新策略导致的。就是他会最后一次性更新所有的视图。
解释：
nextTick会传入一个回调函数，内部会把回调函数往微任务或者
宏任务队列的最后，内部执行任务队列，任务队列回去做一些视图更新的操作，源码角度来讲就是调用的watcher.updater(),从而最去执行nextTick的回调函数时候，确保了这时候视图已经更新了，我们拿到的dom值就是最新的值，结合工作来讲，一般更新数据后，获取最新dom的宽高，滚动高度等等，这些都需要最新的dom才能精准计算。
决于当前浏览器环境的支持，而这种异步更新策略会确保我们对dom的操作时候获取到视图的值是最新的。
代码解释：
所谓异步更新策略，就是Vue内部的一个事件队列，有自己的执行顺序
callbacks = [flushtask,cb]
cb是在异步冲刷队列之后执行
为什么使用nextTick?
由于Vue的采用的是”异步更新策略“，当数据发生变化的时候，不会立即更新dom,而是建立一个任务队
列，并缓存在同一事件循环的所有数据更新。
作用?
由于每一次数据更新会触发watcher去执行dom更新，1000个数据更新会导致1000次dom操作，为了减少这种频繁的更新，将所有的更新都合并成一次,减少dom的操作
时机？
nextTick是放在微任务中执行的，Promise.then、MutationObserver、setImmediate、setTimout，若有对应的方法则在对应方法中执行，兜底是setTimeout
key的作用
可以作为新旧dom的比较判断条件，减少不必要的dom操作，提升更新效率,当循环的列表项越多，key的作用就越大
工作中：频繁变动的列表要用id这种唯一标识来做key，确保唯一性，索引不稳定，一旦列表发生排序，key就会对应的改变。如果是列表不变化的情况才可以用索引做key
