千锋教育web前端高频面试题视频教程，kerwin大话前端面试秘籍（附答案）

P15 Vue高频面试题

一、路由懒加载

Vue Router中已经支持路由懒加载了，形式为箭头函数的形式，可以理解为解释到这一行代码时才执行当前的箭头函数，箭头函数执行结果是引入路由。

二、插槽

插槽的作用是占位以及自定义，父组件在调用的时候可以把自定义好的视图部分传递到组件内部的slot标签的位置进行替换，插槽主要有三种。

1、默认插槽

默认插槽不需要给定名字，直接写成slot标签，一个组件内部只能有一个默认插槽

2、具名插槽

具名插槽需要在slot标签的name属性上写上名字，使用的时候只需要在template标签中通过 v-slot:插槽名字指定具名插槽

3、作用域插槽

作用域插槽需要在slot标签中把数据传递给父组件，父组件获取到数据之后进行自定义，然后传给子组件进行渲染视图

三、Vue-loader

解释和转换.vue文件，提取出其中的逻辑script代码样式代码style以及HTML模板template，再分别把它们交给对应的去Loader处理。

四、Vue和React中diff算法的区别

相同点：

1、只做同级比较，同级别的和同级别的进行比较，不会发生根和子级发生比较的情况。

不同点：

1、vue对比节点。当节点元素相同，但是classname不同，则Vue认为是不同类型的元素，删除旧节点重新创建新节点，而react认为是同类型节点，只是修改节点属性。

2、vue的列表对比，采用的是两端到中间比对的方式，而react采用的是从左到右依次对比的方式。当一个集合只是把最后一个节点移到了第一个，react会把前面的节点依次移动，而vue只会把最后一个节点移到第一个。总体上，vue的方式比较高效。

3、React 在组件更新时立即执行 diff 算法，而 Vue 使用了一种异步更新策略，将多次修改合并成一次更新，然后再执行 diff 算法。

五、Vue中create和mount的区别

create：初始化阶段，主要完成数据的绑定，watch和事件的挂载，虚拟DOM还未形成真实DOM，无法获取DOM节点

mount：完成虚拟DOM到真实DOM的转换挂载，此时HTML以及渲染出来，可以直接获取到DOM节点