2020-11-06 vue面试题集合

1、说下Vue的双向绑定
Vue2中，使用数据劫持结合发布订阅的模式来对数据进行响应式处理，使用Object.defineProperty(obj,prop,descriptor)方法对各个属性的set，get进行劫持，在数据变动时时发布消息给订阅者，触发相应的监听回调
在初始化Vue后，会执行$mount方法，通过mountComponent函数new一个Watcher实例，会把当前的watcher实例赋值给Dep.targer全局属性，defineReactive方法里new一个Dep类，get方法里在Dep.targer存在时把其添加到Dep类中的subs数组中，set方法当有数据变化时调用dep.notify()方法，这个方法会循环subs数组，调用每个watcher实例的update方法

2、说下虚拟dom和diff算法
虚拟dom使用原生JS对象去描述一个DOM节点，在Vue中使用Vnode Class类去描述的，首先Vue会把模板通过渲染函数变成以Vnode形式虚拟dom节点树，然后判断是否是第一次渲染，不是的话就和上一次的虚拟dom树进行比较，只渲染差异的部分
diff算法是通过同层的树结点比较而非对树进行逐层遍历的方式，时间复杂度为O(n)

3、Vue中列表渲染时使用key的作用
key的作用主要是用在Vue的虚拟dom算法中，在新旧nodes比较时，如果不使用key，Vue会是使用一种最大限度减少动态元素和并且尽可能的尝试就地修改和复用相同类型的元素
而使用key后，它会基于key的变化重新排列元素顺序，并且会移除key不存在的元素

持续更新…