说说 Vue 的响应式原理。
五个经典回答示范
Vue2 用 Object.defineProperty 劫持属性的 getter/setter：读取时收集依赖，修改时派发更新；数组方法被重写，新增属性要手动 set。Vue3 换成 Proxy 代理整个对象，能监听新增删除和数组索引，性能也更好。依赖管理上，组件的渲染函数作为一个副作用订阅数据，数据变了重新渲染，更新是异步批量执行的，nextTick 就是在批量更新后回调。
我会对比两代差异再讲实践：defineProperty 初始化时递归全量劫持，深层对象开销大；Proxy 惰性代理，访问到才深层处理。踩过的坑：Vue2 里给对象动态加属性不生效，要用 set；解构 reactive 对象丢失响应性，因为拿到的是普通值，要用 toRefs 保持引用。理解原理能直接少踩这类坑。
响应式我抽象成三件事：依赖收集、变更通知、批量调度。Vue3 的 effect 是核心：组件 render 包成响应式副作用，访问数据时把 effect 注册到对应 targetMap 的依赖集合；set 触发时按组件去重后放进微任务队列统一刷新，这是 nextTick 的来源。工程上关注大列表的依赖规模、shallow 与 markRaw 的取舍，响应式不是免费的。
追问『ref 和 reactive 怎么选』：ref 单值与替换语义通用，reactive 适合聚合状态对象，团队统一风格更重要；『为什么 Vue3 用 Proxy』：语言层面能力完整、惰性初始化、不再需要数组方法重写；『computed 和 watch 区别』：computed 是带缓存的派生值，watch 是副作用响应，语义不要混用。
『Vue 是双向绑定，数据和视图自动同步，原理就是自动监听，具体底层没看过，反正框架都帮我们做好了。』——点评：『双向绑定』只是 v-model 的语法糖概念，答原理时用这个词说明认知停留在使用层；框架帮做好了不等于工程师不需要理解，性能问题来了无从下手。
- 打开 模拟练习，选择「前端开发」方向，限时 3 分钟作答本题。
- 对照上方答题框架，逐点检查：哪些要素没覆盖、哪里表达啰嗦。
- 用自己项目的真实经历替换框架中的占位内容，重讲一遍并录音回听。
这类题在真实面试中常被追问细节，
建议进入限时模式练一遍。