手写防抖节流callbindPromise复习深度解析
防抖、节流、call、bind、Promise 是命中率最高的手写题集合,覆盖闭包、this、异步、微任务等核心机制。 能写出来说明你真正理解这些 API 在底层干了什么。
防抖、节流、call、bind、Promise 是命中率最高的手写题集合,覆盖闭包、this、异步、微任务等核心机制。 能写出来说明你真正理解这些 API 在底层干了什么。
Vue3 组件通信不止 props 和 emit,从父子到全局有十余种方式,选型关键是按耦合度匹配场景。 亲近用 props/emit,跨层级用 provide/inject,全局用 Pinia,模板定制用插槽,面试常考各种方式的适用边界与优缺点。
Vue Router 核心是 URL 变化映射为组件切换,通过 Hash 或 History 模式劫持地址变化,用 matcher 算出对应组件树再由 router-view 渲染。 中间经过一条可拦截的导航守卫管线,面试常考两种模式的区别、history 模式刷新 404 的原因与解决、以及导航守卫的执行顺序。
Pinia 是 Vue3 官方状态管理库,本质是用 Composition API 把全局 reactive/ref 包装成 store,去掉了 Vuex 的 Mutation 与 Module 嵌套。 靠 Proxy 响应式加 TS 类型推导,让状态管理退回到写一个全局组合式函数,面试常考它与 Vuex 的差异和为什么更轻量。
Composition API 用函数组合代替选项分散,把同一功能的数据、方法、侦听器写在一起,解决 Options API 组件变大后一个功能改三处的痛点。 面试常考它与 Options API 的本质区别、setup 的执行时机,以及为什么大型项目更推荐组合式。
Vue3 的 Diff 等于预处理(头尾同步)加最长递增子序列最小移动,五步走完:头同步、尾同步、纯增删、key 映射、LIS 决定谁动谁不动。 实际场景接近 O(n),面试常要求口述完整过程,能讲清双端比较与 LIS 的分工即可拿分。
Vue2 中 v-for 优先级高于 v-if,同元素时会先遍历完整列表再逐项判断,浪费性能;Vue3 反过来,v-if 更高并直接报错阻止这种写法。 本质是用编译器约束引导最佳实践,面试常考两者同处一个元素时的执行顺序差异与正确写法(computed 过滤或 template 包裹)。
最长递增子序列 LIS 找出序列中保持递增的最长子序列,Vue3 把它用于虚拟 DOM Diff,让列表重排时 DOM 操作降到理论最低。 面试既考 O(n 平方) 动态规划,也考 O(n log n) 贪心加二分以及用于在 Diff 中决定哪些节点不需要移动,是算法与框架结合的典型题。
patch 是 Vue3 DOM 更新的总入口,对比新旧 VNode 找最小差异并精确应用到真实 DOM。 核心是同类型节点递归修补、不同类型节点直接替换,配合编译期 PatchFlags、双端 Diff 与 key 快速查找把算法压到 O(n)。
虚拟 DOM 是一棵用 JS 对象描述的影子 DOM 树,站在真实 DOM 与框架之间,通过 diff 算出最小变更再一次性写入。 它的价值不是比手动操作 DOM 更快,而是让你用声明式代码写 UI,框架自动产出接近手写优化的更新,面试常考其存在意义。