前端面试题系列文章：
- 【1】备战前端实习面试之HTML篇
- 【2】备战前端实习面试之CSS篇
- 【3】备战前端实习面试之JavaScript篇
- 【4】备战前端实习面试之React篇
- 【5】备战前端实习面试之Vue篇
- 【6】备战前端实习面试之Node.js篇
- 【7】备战前端实习面试之浏览器篇
- 【8】备战前端实习面试之性能优化篇
- 【9】备战前端实习面试之计算机网络篇
- 【10】备战前端实习面试之手写代码篇
- 【11】备战前端实习面试之代码输出结果篇
Vue
vue 中 key 有什么作用？
- 虚拟 DOM 中 key 的作用：
key 是 虚拟 DOM 对象的标识，当数据发生变化时，Vue 会根据新数据生成新的虚拟 DOM ，随后 Vue会进行新虚拟 DOM 与旧虚拟 DOM 的差异比较，比较规则如下：
- 旧虚拟 DOM 中找到了与新虚拟 DOM 相同的 key
- 若虚拟 DOM 中内容没变，直接使用之前的真实 DOM
- 若虚拟 DOM 中内容变了，则生成新的真实 DOM ，随后替换掉页面中之前的真实 DOM
- 旧虚拟 DOM 中未找到与新虚拟 DOM 相同的 key
- 创建新的真实 DOM ，随后渲染到页面
- 用 index 作为 key 可能会引发的问题：
- 若对数据进行 逆序添加、逆序删除等破坏顺序的操作，会产生没有必要的真实 DOM 更新（界面效果没问题，但效率低）
- 如果结构中还包含输入类的 DOM ，会产生错误 DOM 更新（界面更新有问题）
