一句话概括 防抖、节流、call、bind、Promise 是前端面试命中率最高的手写题集合——它们覆盖了闭包、this、异步、微任务等 JS 核心机制，能写出来说明你理解这些 API 到底在底层干了什么。 核心知识点 1. 防抖（Debounce）—— 等你不抖了再执行 场景：搜索输入框每按一个键都发请求 → 用防抖，等停止输入 300ms 再发。 function deboun...

一句话概括 Vue 3 的组件通信不止 props + emit——从父子到全局，有超过十种方式，选型的关键是按耦合度匹配场景：亲近用 props/emit，跨层级用 provide/inject，全局用 Pinia，模板定制用插槽。 核心知识点 1. props + emit（最基础的父子通信） <!-- 父组件 --> <Child :name="userNam...

一句话概括 Vue Router 的核心是把 URL 变化映射为组件切换——通过 Hash 或 History 两种模式劫持浏览器地址变化，用路由匹配器（matcher）算出当前 URL 对应哪棵组件树，再由 <router-view> 渲染出来，中间经过一条可拦截的导航守卫管线。 核心知识点 1. Hash 模式 vs History 模式 // Hash 模式 —— ...

一句话概括 Pinia 是 Vue 3 的官方状态管理库，本质就是用 Composition API 把全局的 reactive/ref 包装成 store，去掉了 Vuex 的 Mutation 层、去掉了 Module 嵌套，靠 Vue 3 的 Proxy 响应式系统 + TypeScript 类型推导，让状态管理退回到「写一个组合式函数，只不过作用域是全局的」。 核心知识点 1....

一句话概括 Composition API 是 Vue 3 用函数组合代替选项分散的逻辑组织方案——把同一功能的数据、方法、侦听器写在一起，而不是散落在 data/methods/watch 各处，解决了 Options API 时代组件大了之后「一个功能改三处」的痛点。 核心知识点 1. Options API 的「逻辑碎片」问题 Options API 按类型分块（data 归 ...

一句话概括 Vue 3 的 Diff 算法 = 预处理（头尾同步） + 最长递增子序列（LIS）最小移动，五步走完：头部同步 → 尾部同步 → 纯增删判断 → key 映射 → LIS 决定谁动谁不动，实际场景接近 O(n)。 核心知识点 1. Diff 五步流程速览 旧: [A, B, C, D, E, F] 新: [A, B, D, E, C, G] ① 头部同步：A==A, ...

一句话概括 Vue 2 中 v-for 优先级高于 v-if，两者同处一个元素时每次渲染都会先遍历完整列表再逐项判断条件，浪费性能；Vue 3 反过来，v-if 优先级更高，直接报错阻止这种写法，倒逼开发者用 computed 过滤或 <template> 包裹——本质上是用编译器约束引导最佳实践。 核心知识点 1. 同元素上的优先级机制 Vue 的模板编译器处理同一元素...

一句话概括 最长递增子序列（LIS） 是一个「找出序列中保持递增的最长子序列（可不连续）」的经典算法。Vue 3 把它用在虚拟 DOM Diff 中，通过找到「不需要移动的节点的最长序列」，让列表重排时的 DOM 操作次数降到理论最低。 核心知识点 1. LIS 的 O(n²) DP 解法 定义 dp[i] 为以第 i 个元素结尾的 LIS 长度。对每个 i，回头看所有 j <...

一句话概括 patch 是 Vue 3 的 DOM 更新入口函数——它对比新旧 VNode，找到最小差异集并精准应用到真实 DOM。核心逻辑就一句：”同类型节点递归 patch，不同类型节点直接替换”。 核心知识点 1. patch 函数的整体流程 function patch(oldVNode, newVNode) { // 1. 类型不同 → 整个替换 if (oldVN...

一句话概括 虚拟 DOM（Virtual DOM）是一棵用 JS 对象描述的”假 DOM 树”，它作为真实 DOM 和框架之间的缓冲层，通过 diff 算法算出最小变更再一次性应用到页面——用 JS 计算成本换 DOM 操作成本。 核心知识点 1. 虚拟 DOM 的本质——一个 JS 对象 // 真实 DOM：<div id="app" class="container">...