1.谈谈你对MVVM的理解？简化映射关系，隐藏控制器。MVVM在MVC的基础上隐藏了控制层。Vue不是MVVM框架，它是一个视图层框架。ViewModal是连接数据和视图的桥梁。二、谈谈你对Vue中响应式数据的理解？当数组和对象类型的值发生变化时，使用defineReactive方法和defineProperty为所有属性添加getter和setter。用户可以在获取和设置值时执行一些操作。缺陷：只能监控最外层的属性。如果是多层，则必须进行全递归。依赖收集会在get(dep[watcher,watcher])中完成数据更新会在set(notify,notifywatchertoupdate)3.Vue中如何检测数组变化？Vue没有为数组定义Property，而是重写了数组的7个方法。它们是：pushshiftpopspliceunshiftsortreverse因为这些方法会改变数组本身。无法监视数组中的索引和长度。4、Vue中如何收集依赖？Vue在初始化的时候，挂载之后会进行编译。生成渲染函数。当获取到值后，watcher会被收集起来放在dep中。当用户更改值时，会通知观察者更新视图。5、如何理解Vue中模板编译的原理？这道题的核心是如何将template转化为renderfunction。将模板模块转换成ast语法书——parserHTML标记静态语法（部分节点不变）重新生成代码——codeGen，使用with语法包裹字符串六、Vue生命周期钩子是如何实现的？Vue的生命周期钩子是一个回调函数，在创建组件实例时会调用相应的钩子方法。hook会在内部进行处理，hook函数会以数组的形式维护。7、Vue组件的生命周期是怎样的？beforeCreate在实例初始化之后，数据观察observer和event之前调用，watcher事件配置。创建的实例已创建。本步骤完成以下配置。eventtimecallback$elhasnotbeengeneratedbeforeMount在mount之前调用，render还没有被调用mountedel被新创建的vm.$el替换，挂载到实例上调用beforeUpdate数据更新时调用并且发生在virtualUpdatebeforeDomre-renderingandpatching由于数据变化，虚拟Dom正在重新渲染和打补丁。之后调用beforeDestroy，实例销毁前调用destroyed，实例销毁后调用。调用之后，Vue实例中的所有东西都会被解除绑定，所有的事件监听器都会被移除，子实例也会被销毁。服务器端渲染期间不会调用此钩子。业务逻辑类似于对象的继承。组件初始化时会调用mergeOptions方法进行合并，使用策略模式合并不同的属性。若混合数据与自身组件数据有冲突，以自身组件数据为准。缺点：命名冲突，数据来源不明确九、Vue组件数据为什么一定要是函数？newVue是单例模式，不会有merge操作，所以根实例不需要验证data一定是函数。组件的数据必须是一个函数，防止两个组件的数据被污染。如果都是对象，合并时会指向同一个地址。而如果是函数的话，在合并的时候调用的时候会产生两个空格。10、请解释下nextTick的原理。nextTick是一个微任务。nextTick中的回调是延迟回调，在下一个Dom更新周期结束后执行。可用于获取DomVue中的更新数据。更新是异步的。使用nextTick可以保证更新后执行用户自定义逻辑。十一、computed和watch有什么区别？computed和watch都是基于watcher实现的。计算属性被缓存，依赖值不变。计算出来的属性方法在赋值的时候不会重复执行。watch是监听值的变化。当值改变时，回调函数将被调用。12.Vue.set方法是如何实现的？Vue为对象和数组本身添加了一个dep属性。当给对象添加一个不存在的属性时，会触发对象依赖的watcher进行更新。当修改数组的索引时，会调用数组自身的splice方法来更新数组13、Vue为什么要使用virtualDom？虚拟dom使用js对象来描述真实的dom，是对真实dom的抽象。由于直接操作Dom性能低，但是js层的操作效率高，可以利用Dom操作转化为对象操作。最后通过diff算法比较差异来更新Dom。虚拟Dom不依赖真实平台环境，可以跨平台。14.Vue的diff算法原理是什么？Vue的diff算法是层次比较，没有考虑跨层次比较的情况。内部使用深度递归的方法+双指针的方法来比较两个节点是否是同一个节点。同一个节点比较属性。重用旧节点时，先比较子节点。考虑到老节点和新节点儿子的情况，比较优化：head,tail,head-to-tail,tail-to-head比较搜索，复用十五，因为Vue可以通过数据准确检测数据变化劫持，为什么差异检测差异？响应式数据变化，Vue确实可以在数据发生变化时，响应式系统立即知道。但是如果给每个属性都加watcher，性能会很差。粒度太细会导致更新不准确，所以采用watcher+Diff算法检测差异。16、请说明按键的作用及原理。在Vue的patch过程中，可以通过key来判断两个虚拟节点是否是同一个节点。更新时没有密钥会导致问题。尽量不要使用索引作为键。十七。谈谈对组件的理解。组件化开发可以大大提高应用程序的开发效率、可测试性和可重用性。常用的组件技术：属性、自定义Events、slot减少更新范围、重新渲染改变值的组件高内聚、低耦合、单向数据流第十八、请描述组件的渲染过程生成组件的虚拟节点——>创建组件的真实节点->插入页面19.请描述组件的更新过程。属性的更新会触发patchVnode方法，组件的虚拟节点会调用prepatchhook，然后更新属性，更新组件。20.异步组件原理先渲染异步占位节点->组件加载完成后，调用forceUpdate强制更新。二十一、函数式组件的优点和原理函数式组件的特点：无状态，无生命周期，无this。所以性能会高一点。普通组件是扩展Vue的类。功能组件只是一个普通的功能。22、元器件值传递的方式有哪些？props和emit：父组件通过prop向子组件传输数据。子组件通过emit向父组件传递数据：父组件通过prop向子组件传递数据。子组件通过emit向父组件传递数据：父组件通过prop向子组件传递数据。子组件通过emit事件parent,parent,parent,children向父组件传递数据，获取当前组件的父组件和当前组件的子组件attrs和attrs以及attrsandlisteners。父组件通过provide提供，子组件注入变量$ref获取实例eventBus级组件数据传递Vuex23.$attrs解决什么问题？主要功能是实现数据的批量传输。provide/inject比较适合应用在插件中，主要是实现跨层数据传递。24.v-for和v-if哪个优先级高？首先，v-for和v-if不能在同一个标??签中使用。首先处理v-for，然后处理v-if。如果同时遇到，可以考虑先使用计算属性处理数据，再进行v-for，这样可以减少循环次数。25、v-mode是如何实现的？组件上使用的v-model是模型和回调。在普通元素上使用v-model会产生指令，也可能是因为元素不同：generatevalue和input什么时候change和radio会产生change和checked指令？源码：26.Vue的普通槽和作用域槽的区别普通槽在渲染后被替换。父组件渲染完成后，替换子组件的内容。编译模板时，处理组件中的子节点和槽标签。创建元素时，使用_t()方法替换_v()的内容。作用域槽作用域槽可以获取子组件内部的属性。在子组件中传入props并渲染。scopeslot的编译结果：28.Vue.use是干什么的？Vue.use用于使用插件。我们可以在插件中扩展全局组件、指令、原型方法等。默认会调用install方法传入vue构造函数，插件中可以使用vue而不依赖vue库。递归调用。可以表示组件的具体名称，方便调试和查找对应的组件。30.vue的修饰符有哪些？.stop.prevent.capture.self.once.passive.right.center.middle.alt31.如何理解自定义指令？生成ast语法树时，遇到指令将directives属性添加到当前元素，通过genDirectives生成指令代码。在patch之前，将指令的hook提取到cbs中，在patch过程中调用相应的hook。在执行cbs对应的hook时，调用相应的指令定义方法32.keep-alive一般用在什么地方？原理是什么？使用keep-alive包裹动态组件时，组件会被缓存起来，避免组件重新创建。有两种场景，一种是动态组件，一种是这里创建的router-view白名单和黑名单。指明哪些需要缓存，哪些不需要缓存。以及缓存的最大数量。缓存的是组件的实例，用key和value对象保存。加载时，监控include和exclude。如果不需要缓存，直接返回虚拟节点。如果需要缓存，则使用组件id和标签名生成key，以当前vnode实例为value，作为对象存储。这是缓存列表。如果设置了最大缓存数，第0个缓存将被删除。添加了最新的缓存。并且给组件添加一个keepAlive变量为true，当组件初始化后，就不再初始化了。三十三、vue-router有多少个hook函数？执行过程如何？钩子函数一共有三个：globalguardroutingguardcomponentguard三十四、vuerouter两种模式的区别vue-router中有三种模式，分别是hash,history,abstractabstract兼容不支持浏览器场景的API变化，但不美观，不利于SEO。有什么？数据层次不要太深，响应数据要合理设置。使用数据时，缓存值的结果应该不经常取。粒度->Vue使用组件级更新，使用功能组件->功能组件开销低，使用异步组件->使用webpack的分包策略，使用keep-alive来缓存组件，比如虚拟滚动和时间分片。六、谈谈你对Vuex的理解？Vuex是专门为Vue提供的全局状态管理系统，用于多个组件中的数据共享和数据缓存。问题：无法坚持。Mutation主要修改状态，同步执行action执行业务代码，方便复用，逻辑可以异步。不能直接修改状态。三十七、vue中使用了哪些设计模式？单例模式：new多次，只有一个实例工厂模式：传入参数创建实例（创建虚拟节点）发布订阅模式：eventBus观察者模式：watch和dep代理模式：_data属性、代理、防抖、节流中介模式：vuex策略模式外观模式
