Vue 高频面试题及详细真实答案（实战版）.docxVIP

Vue高频面试题及详细真实答案（实战版）

一、Vue基础核心面试题

1、说说你对Vue响应式原理的理解？Vue2和Vue3有什么区别？

参考答案：

Vue的响应式核心就是数据劫持+依赖收集+派发更新，简单说就是监听数据变化，自动更新视图。

Vue2响应式原理：

基于Object.defineProperty()对对象的属性进行劫持，拦截属性的读取（get）和修改（set）操作。

缺点很明显：

无法监听对象新增、删除的属性，所以需要Vue.set/this.$set

无法监听数组下标修改、数组长度修改，只能重写数组七个变异方法（push/pop/shift/unshift/splice/sort/reverse）

只能遍历对象已有属性，深层对象需要递归遍历，初始化性能开销大

Vue3响应式原理：

基于ES6Proxy代理整个对象，直接监听对象整体的读写、删除、新增操作，解决了Vue2的所有痛点。

优势：

支持监听对象新增、删除属性，支持数组下标、长度修改

懒代理模式，只代理用到的属性，深层数据不会一次性递归遍历，性能更好

支持Map、Set等复杂数据结构

2、Vue中data为什么必须是一个函数？

参考答案：

这个问题只针对组件，根实例的data可以是对象。

组件是可复用的模板，如果data是一个对象，所有组件实例会