MVVM

ViewModel：内部集成了Binder，Binder会实现View和Model的双向绑定View，可组件化，View的变化会通过Binder自动更新相应的ModelModel：Model的变化会被Binder监听，一旦监听到变化则会自动实现视图更新

生命周期

beforeCreate&created,实例化Vue，初始化数据观测，属性，方法beforeMount&mounted,Dom挂载beforeUpdate&updated,数据更新beforeDestroy&destroyed,组件销毁

双向绑定原理

通过数据劫持，加上发布订阅模式的方式，通过object。defineProperty()来劫持各个属性的setter,getter,在数据变动的时候发布消息给订阅者，触发相应的监听回调，整合Observer,Compile,Watcher三者，通过Observer监听model的数据变化，通过compile来解析编译模板指令,最终利用watcher搭建observer和compile之间的通信桥梁，达到双向绑定的效果

Vue router

hash模式:URL中#以及#后面的字符称为hash，它不被包括在http请求中，对服务端安全没有用，不会重新加载页面history模式:发起的请求地址必须前后端一致，提供了两个新的方法，pushState(),replaceState()可以对浏览器的历史记录栈进行修改，还有就是popState()监听状态的变更

Vuex状态管理

state:state改变,View也会跟着改变mutation:这是修改state的唯一方法，但是mutation是同步的，同步就会阻塞action:action是异步的，通过store.dispatch来触发某个action，谭厚action里面通过store.commit(‘xxxx’)来触发mutation,一个action可以触发多个mutationgetter:方便计算属性的复用modules:模块化管理

组件通信

父传子：props,$children子传父:$emit,$parent非父子组件之间：eventBus,vuex跨级通信：provide/inject(父组件通过provide注入变量，子组件通过injected接收),$attrs/$listeners

virtual DOM

是什么

是对DOM的抽象，本质上是JS对象

作用

通过diff算法，减少js操作的真实DOM带来的性能消耗抽象了原本的渲染过程，实现了跨平台的能力

diff算法

用JS模拟真实的DOM节点 2，把虚拟的DOM转换成真实的DOM插入页面中发生变化时，比较两棵树的差异，生成差异对象根据差异对象更新真实的DOM

computed 和 watch的区别

computed有缓存，watch无缓存computed主要用于对同步数据的处理，watch则主要用于观测某个值的变化去完成一段开销较大的复杂业务逻辑 总结：computed擅长一个数据受多给数据影响，watch擅长一个数据影响多个数据

v-if和v-show的区别

v-show是控制元素的display属性，v-if是条件渲染，只有为真时才被渲染v-show首次渲染开销大，切换开销小，v-if首次开销小，切换开销大v-if可以搭配v-else-if,v-else

vue常用的事件修饰符

.prevent：提交事件不再重新加载页面.stop：阻止事件的冒泡.self：当事件发生在该元素本身而不是子元素时才会触发.capture：事件侦听，事件发生的时候会调用.once：事件只触发一次.passive：移动端优化，滚动行为发生时立即触发事件