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

P15 Vue高频面试题-3

1、vue-router 实现懒加载

当打包构建应用时，JavaScript 包会变得非常大，影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块，然后当路由被访问的时候才加载对应组件，这样就更加高效了。

const Foo = () => import('./Foo.vue')

2、react和vue中diff算法区别

首先diff算法的处理方法，对操作前后的dom树同一层的节点进行对比，一层一层对比，当某一层有很多相同的节点时，也就是列表节点时，diff算法的更新过程默认情况下也是遵循以上原则。

vue和react的虚拟DOM的Diff算法大致相同，其核心是基于两个简单的假设

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

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

3、computed和watch的区别

computed：计算结果并返回，只有当被计算的属性发生改变时才会触发（即：计算属性的结果会被缓存，除非依赖的响应属性变化才会重新计算）

watch：监听某一个值，当被监听的值发生变化时，执行相关操作。

与computed的区别是，watch更加适用于监听某一个值得变化，并做对应操作，比如请求后太接口等。而computed适用于计算已有的值并返回结果。 监听简单数据类型。