vue原理相关总结

　　一、vue2。0的双向绑定是怎么实现的
　　1、view和model相互实时更新原理：Object。defineProperty数据劫持发布者订阅者（依赖收集）模式
　　2、observer，compile，watcher
　　（1）observe是一个数据监听器，核心方法是Object。defineProperty
　　（2）watcher是一个订阅者，将Observer发来的update消息处理，执行更新
　　（3）compile是一个指令解析器，对需要监听的节点和属性进行扫描和解析。
　　3、此模式的优点：不需要显式调用，可以直接通知变化，更新视图；劫持了属性setter，不需要额外的diff操作
　　4、Object。defineProperty缺点
　　（1）不能监听数组
　　（2）不能监听整个对象，只能监听属性
　　（3）不能监听属性的增删，只能监听变化
　　5、3。0版本使用Proxy
　　（1）可以监听数组
　　（2）可直接监听整个对象，不用层层递归属性
　　（3）get和set时候直接有参数，不需要单独存储变量
　　（4）newProxy（）会返回一个新对象，不会污染源对象。
　　二、数据不更新的问题
　　1、更新的原理：在数据读取时收集依赖，在赋值时通知依赖更新。
　　2、object有defineProperty方法，通过getter，setter只监听了属性的读取和赋值，但是新增属性和删除属性没有检测，所以专门提供了set和delete来实现
　　3、array，没有defineProperty方法，没有setter，通过get和新建数组方法拦截器修改原生方法push，pop，shift，unshift，splice，sort，reserve来实现监听，而通过修改数组下标操作数组的不会被检测，所以专门提供了set和delete来实现
　　4、set（target，key，value）和delete（target，propertyNameindex）方法原理
　　（1）判断target是否是undefined，null，或者原始类型，或者vue实例，或者vue实例的跟数据对象
　　（2）target为数组，则还是通过调用splice操作索引更新数据
　　（3）target为对象，且为响应式，则调用defineReactive操作数据
　　（4）更新完数据后通知依赖更新
　　三、computed和watch和methods
　　1、computed
　　（1）设计初衷：为了使模板中的逻辑运算更简单
　　（2）适用于数据被重复使用或者计算复杂费时的场景；依赖其他数据的场景
　　（3）读取缓存，依赖不变，则不需重新计算。（根据dirty标志判断）
　　2、watch是对数据的监听回调
　　3、computed和watch的区别
　　相同点：都会观察页面的数据变化
　　不同点：（1）computed是读取缓存，watch每次都要重新执行；
　　（2）watch更适合数据变化时的异步操作和开销较大的操作。
　　4、computed和methods的区别
　　computed依赖缓存，可以定义getter和setter，但是methods不行
　　四、vuerouter的模式区别
　　1、abstract：非浏览器环境下使用
　　2、hash：
　　（1）默认。监听hashchange实现。
　　（2）有点，兼容性好，ie8支持
　　（3）缺点：看起来奇怪
　　3、history：
　　（1）h5新增的。允许开发者直接修改前端路由而不重新触发请求页面
　　（2）实现原理：监听popstate事件。能监听到用户点击浏览器的前进后退事件或者手动调用go，back，forward事件；不能监听到pushState和replaceState事件。
　　（3）为了避免浏览器刷新出现的404页面，需要在服务端配置兼容。
　　（4）如果浏览器不支持，会降级到hash模式
　　通过vue。use插件机制和vue。mixin将store在beforeCreate和destroyed生命周期进行混入。
　　五、vuex解决了什么问题
　　1、vuex解决了vue项目中的数据状态管理问题
　　2、是组件通信的一种方式。
　　3、原理：创建了单一的状态树，包含state，mutation，action，getter，module。
　　4、view（dispatch）action（commit）mutation（mutate）state（render）view
　　5、通过vue的data和computed，让state变成响应式，
　　6、通过vue。use插件机制和vue。mixin将store在beforeCreate生命周期进行混入。
　　六、nextTick是怎么是实现的
　　1、作用：将回调延迟到下次DOM更新循环之后执行
　　2、原因：VUE在更新DOM时是异步的，vue检测到数据变化后，不会立即更新DOM，而是会开启一个事件队列，并缓冲同一时间循环中的所有数据变更，在下一次tick中，执行更新DOM。
　　3、js的运行机制：js是单线程的，基于事件循环，有宏任务和微任务。
　　4、内部原理：
　　（1）能力检测：Promise。then（微），MutationObserve（微），setImmediate（微），setTimeout（宏）
　　（2）将回调函数推入回调队列，锁上易步锁，执行回调。
　　七、keepalive内置组件和LRU算法（队列）
　　1、自身不会渲染成DOM，没有常规的标签，是个函数组件，被他包裹的组件，切换时会被缓存在内存中，而不是销毁。
　　（1）可以有条件的缓存：include（匹配到的缓存），exclude（匹配到的不缓存），max（最多可以缓存多少组件实例）
　　2、原理：内部维护了this。cache（缓存的组件对象）和this。keys（this。cache中的key），运用LRU策略。
　　（1）命中了缓存的组件要调整组件key的顺序。
　　（2）缓存的组件数量如果超过this。max时，要删除第一个缓存组件。
　　（3）LRU（Leastrecentlyused，最近最少使用）：根据数据的历史访问记录来进行淘汰数据。如果数据最近被访问过，那么将来被访问的几率也更高。
　　3、生命周期钩子：activated和deactivated，被keepalive包括的组件激活和停用时调用。先停用组件的deactivated，再激活组件的activated