做了三年业务前端代码写了不少组件库也攒了一堆但真要迈出跳槽这一步的时候才发现自己脑子里全是糊的。去年下半年我集中面了一圈从中小厂一路面到几家大厂拿了两个 offer也挂了好几轮。这篇文章把整个过程的复盘整理出来分上下两篇。上篇主要讲准备阶段、简历、以及面试里最高频的基础知识考点下篇重点讲框架原理、项目深挖和场景题。先说结论三年经验这个节点面试官看的不再是“你会不会写页面”而是“你有没有形成一套自己的方法论”。知识点当然要背但更重要的是能把知识点串起来能讲清楚每个技术选型背后的 trade-off。这篇面经就是围绕这个目标来写的。1. 简历和投递策略别让面试还没开始就结束了1.1 三年经验简历最容易踩的三个坑三年经验的简历我刷了不下几十份也帮朋友改过不少最常见的坑有三个。第一个坑是把简历写成“项目流水账”。很多人写项目经历就是“负责XX系统开发使用Vue全家桶实现了XX功能”每一条都差不多面试官看完根本记不住你做了什么。正确的做法是每个项目突出 1-2 个有技术难度或业务亮点的点比如“将首屏加载时间从 3.2s 优化到 1.1s核心手段是路由级代码分割 图片懒加载 关键接口预请求”或者“设计了一套可配置的表单引擎让运营同学不需要发版就能上线新活动页”。有数字、有手段、有结果这才是有信息量的项目描述。第二个坑是技能清单写得太多太杂。一会儿写熟悉 Webpack一会儿写熟悉 Vite一会儿又写熟悉 Node.js、TypeScript、小程序、可视化感觉什么都懂。面试官一旦深挖你就会发现每个都是半吊子反而拉低整体评价。建议只写自己真正有底气的 3-5 项核心技能并且标注熟练程度比如“熟练掌握 React 及其周边生态了解 Fiber 架构基本原理”。坦诚一点比虚张声势更能赢得信任。第三个坑是完全没有“亮点前置”。三年经验的简历面试官平均停留时间可能不到 30 秒。一定要把最重要的信息放在最显眼的位置学历、工作年限、核心技能标签、最有代表性的项目最好在简历前三分之一就能让面试官形成“这个人可以约来聊聊”的判断。提示面试官看简历的心态是“找证据”不是“找亮点”。他们希望从你的简历里看到你具备他们岗位需要的能力所以针对不同的岗位 JD简历项目侧重点应该做微调不是一份简历投所有公司。1.2 如何读懂 JD 背后的真实需求很多人投简历是不看 JD 的或者只看了岗位名称和技术栈就投了。三年经验阶段建议把 JD 拆开来看。以“高级前端工程师”常见 JD 为例里面通常包含这些关键词“负责核心业务前端架构设计”“参与前端工程化建设”“优化前端性能”“指导初级工程师”。翻译一下就是希望你能独当一面能解决业务里的复杂问题能推动基础设施完善最好还有一点带人经验。反过来说如果 JD 里写了“负责活动页开发”“配合产品完成需求评审”那大概率是一个执行岗面试难度会低一些但成长空间也有限。根据自己的阶段目标选择合适的岗位比盲目冲大厂 Title 更重要。我见过不少人在 P6/P7 边缘反复横跳最后发现进去之后做的事情和预期完全不符。投递策略上一个比较稳的节奏是先投 3-5 家不太想去的公司练手感受下面试氛围和节奏把自我介绍、项目介绍这些必考题打磨顺了再投目标公司。不要一上来就面最想去的容易因为紧张或者不熟悉流程而挂掉。我自己就是先面了一家中小厂和一家中厂把状态调整好了才去面的最后拿 offer 的两家。1.3 三个月冲刺准备期的精力分配如果你的准备时间是三个月建议按照“基础补全 → 框架源码 → 项目复盘 → 刷题冲刺”四个阶段来安排每个阶段三周左右。基础补全阶段主要过一遍 JS 核心概念闭包、原型链、异步、事件循环、浏览器原理渲染、缓存、安全、网络基础HTTP、HTTPS、TCP、CSS 布局与动画、前端工程化基础。这个阶段的重点是“查漏”哪些知识模棱两可就标记下来后面集中攻克。框架源码阶段选一个主攻框架把核心原理吃透。如果工作用 React就啃 Fiber 架构、Hooks 原理、状态管理方案选型如果工作用 Vue就研究响应式原理、编译优化、运行时设计。同时对比另一个框架的异同这是面试里经常出现的“对比题”。项目复盘阶段把过去三年参与的项目全部梳理一遍每个项目按“背景 → 难点 → 方案 → 结果 → 复盘”五段式整理。这是面试里最不能临时发挥的部分一定要提前写下来反复打磨表达。最后三周是刷题冲刺阶段。算法题重点刷高频题前端手写题也要准备好。这个阶段的节奏是每天保持手感不需要题海战术但要保证见到常见题型能迅速想到思路。2. 三年经验面试的高频考点哪些必须烂熟于心2.1 JS 核心闭包、事件循环和异步方案三年经验面试JS 基础不会再问那种“var 和 let 区别”的入门题了但会在更深的场景里考察你对核心概念的理解。闭包的考察通常不是让你背定义而是结合场景比如“写一个计数器函数每次调用返回自增的数值”“用闭包实现私有变量”“说说闭包的内存泄漏问题以及如何避免”。我遇到过最刁钻的一道题是“闭包里的变量和普通变量在内存分配上有什么区别什么时候闭包的变量会被回收”这个问题光会背“返回函数”是答不好的需要理解执行上下文、词法环境和垃圾回收机制之间的关系。事件循环是大厂必考。考察形式通常是给一段混合了 setTimeout、Promise、async/await 的代码让你写出输出顺序。三年经验不仅要能答对输出顺序还要能解释清楚 microtask 和 macrotask 的优先级、async/await 在事件循环里的特殊处理、以及 Node.js 环境下的 event loop 和浏览器环境有什么区别。建议画一张完整的事件循环示意图存在脑子里面试时可以画给面试官看这是一个很好的加分动作。异步方案的发展脉络也要了解callback → Promise → Generator → async/await。为什么要引入 PromisePromise 解决了什么问题又带来了什么问题async/await 为什么被称为“异步的终极解决方案”。这些演进逻辑比背 API 重要得多因为面试官想听的是你的理解不是背诵。2.2 浏览器原理与性能优化三年经验的必考分水岭“从输入 URL 到页面渲染完成发生了什么”是前端面试的“万金油”题。三年经验阶段这道题的回答深度直接影响面试官对你的定位。初级回答是DNS 解析 → TCP 连接 → 发送 HTTP 请求 → 服务器返回 HTML → 浏览器解析 HTML 构建 DOM 树 → 加载 CSS 构建 CSSOM 树 → 合并渲染树 → 布局 → 绘制。这个回答能拿到及格分但拿不到高分。高分回答要补充的关键细节包括DNS 解析有几步缓存浏览器缓存、系统缓存、路由器缓存、DNS 服务器缓存TCP 建立连接的握手过程、为什么是三次握手HTTP 请求头和响应头里有哪些关键字段Cache-Control、ETag、Connection、Content-Encoding 等渲染进程中主线程如何处理 HTML 解析和脚本执行的关系浏览器遇到 script 标签会阻塞解析所以有 defer 和 asyncCSS 是否会阻塞渲染重排和重绘的区别以及如何减少。围绕性能优化最常被问的问题集中在首屏加载优化怎么做白屏时间、首屏时间、可交互时间这几个指标如何定义和测量前端有哪些常见的性能优化手段对应的原理是什么这里我建议准备一个自己实际做过并产出了可量化收益的优化案例作为核心素材因为面试官大概率会顺着你的回答往深了问。我自己的素材是给公司电商活动页做的一次整体优化先通过 performance 面板定位出首屏最大的性能瓶颈是首屏 JS 执行时间过长然后做了三件事——把首屏非必要的组件全部改为异步加载、将项目从 webpack 的 initial chunk 拆法迁移到基于路由的按需拆包、对图片全部加上响应式尺寸和懒加载。最终首屏 FCP 从 2.8s 降到 1.2sLCP 从 4.1s 降到 2.3s。这个案例在面试里讲了不下十次每次都是面试官追问的重点。2.3 CSS 和工程化容易被忽视但拉开差距的板块三年经验的面试里纯 CSS 布局题考得不多但有一类题几乎每次都会出现“用 CSS 实现一个三角形”“实现两栏布局左边固定右边自适应”“说说 flex 和 grid 的区别什么场景下怎么选”“如何实现主题换肤”。这些题背后的考点其实是你写 CSS 的时候是会用还是真的懂。我总结了一套 CSS 面试的准备思路不用背所有属性但要把盒模型标准盒模型和 IE 盒模型的区别、BFC什么是 BFC、如何触发、解决了什么问题、层叠上下文z-index 为什么有时候会失效这三个基础概念吃透然后熟练掌握 flex 和 grid 的核心属性。做到这一步大部分 CSS 面试题都能应对。工程化方面三年经验最常见的问题包括Webpack 构建流程是怎样的loader 和 plugin 的区别是什么如何做构建性能优化Vite 和 Webpack 的核心差异是什么Babel 的工作原理。这些问题看起来很大但核心其实就是“构建工具到底帮我们做了什么”这一个问题。我建议这里可以准备一个自己优化构建速度的真实案例。比如我们公司的项目用 Webpack 5开发时冷启动要 40 多秒。后来我把 babel-loader 加了 cache 和 thread-loader把不需要解析的第三方库通过 module.noParse 跳过解析又把构建产物做了持久化缓存冷启动时间降到了 12 秒左右。这个案例体现了你不仅会写业务代码还能对工程效率有意识和动手能力面试官通常非常买账。3. 框架原理深挖从使用到理解的必经之路3.1 React 核心原理面试官最常追问的三个方向如果你面的岗位是 React 技术栈有几个问题几乎必问虚拟 DOM 是什么为什么需要虚拟 DOMReact 的渲染流程是怎样的Fiber 架构解决了什么问题。虚拟 DOM 这个问题三年经验不能再停留在“操作真实 DOM 性能差所以用虚拟 DOM”这个浅层认知了。更准确的理解是虚拟 DOM 的价值在于它把“状态 → UI”的映射从命令式的 DOM 操作变成了声明式的状态描述让开发者可以专注于状态管理而把 DOM 操作的细节交给框架。它是一个抽象层带来的是开发效率和可维护性而不仅仅是性能。Fiber 架构是区分“会 React”和“懂 React”的分水岭。你需要能说清楚React 15 的递归渲染存在什么问题一旦开始渲染就不可中断可能导致长时间阻塞主线程Fiber 架构如何通过把渲染工作拆分成可中断的小单元来解决这个问题工作循环work loop是怎么运作的优先级调度lane 模型是怎么回事。不需要把源码每行都背下来但能画出一个整体的流程图并且讲清楚关键节点的设计意图就足以证明你深入研究过。Hooks 原理是另一个高频深挖点。面试官可能会问为什么 Hooks 不能在条件语句里调用useState 和 useReducer 的底层实现有什么区别useEffect 的依赖数组是怎么比较的这些问题的核心都是理解 Hooks 的内部数据结构链表和更新队列。建议有时间的话找一篇讲 Hooks 源码实现的文章配合 React 源码调试一遍把这些概念彻底打通。3.2 Vue 核心原理响应式和编译优化的内功Vue 技术栈的小伙伴同样要对原理有足够深的理解。Vue 3 的响应式实现是基于 Proxy 的而 Vue 2 是基于 Object.defineProperty 的。面试官很可能会问两者有什么区别Proxy 解决了 Vue 2 在响应式上的哪些遗留问题Vue 3 为什么还要提供 ref 和 reactive 两种响应式 API这个问题需要你理解 defineProperty 的两个核心缺陷只能劫持对象属性的 getter/setter无法拦截属性的新增和删除对数组的索引变化和 length 变化无法响应。而 Proxy 直接代理了整个对象天然支持新属性添加和删除监听。但 Proxy 也有代价兼容性要求更高而且在某些场景下对性能有影响。所以 Vue 3 才设计 ref 来解决基础类型值的响应式问题。Vue 3 的编译优化也值得准备。diff 算法从 Vue 2 的全量对比到 Vue 3 的静态标记patchFlag和 block tree性能提升的核心逻辑就是“减少对比范围”。面试的时候能把这个优化思路讲清楚会明显拉开和其他候选人的差距。如果你两个框架都写过那一定要准备一道对比题React 和 Vue 在设计哲学上有什么核心区别我的回答思路是React 更偏向“纯 JS”路线jsx 就是构建 UI 的表达式状态变化后整个组件重新渲染通过 Fiber 调度和协调来保证性能Vue 则采用响应式依赖追踪状态变化时精确更新对应组件同时对模板做编译优化。React 的理念是“你要对渲染过程负责”Vue 则是“框架帮你搞定一切”。这种哲学差异没有对错但能体察到差异本身说明你已经在思考框架的本质了。3.3 状态管理和数据请求业务复杂度的试金石三年经验面试状态管理相关的问题通常是“你们项目为什么选这个方案”“有没有遇到状态管理混乱的问题怎么解决的”。这背后考察的其实是你对业务复杂度的判断力。不需要把所有状态管理库的源码都读一遍但需要形成自己的选型方法论。我的经验是组件间共享状态优先考虑组合/上下文中等复杂度的全局状态用 Zustand 或 Jotai 这类轻量方案心智负担低大型应用才需要考虑 Redux Toolkit 或 Pinia并且要配套思考异步 action、实体关系、持久化等基础设施。你可以不同意这个结论但一定要有自己的思考框架。数据请求方面要熟悉 fetch 和 axios 的差异、如何封装统一的请求层拦截器、错误处理、取消请求、如何处理接口竞态和并发。这里面试官还会问“你是怎么管理接口返回的数据缓存的”如果你用过 React QueryTanStack Query或 Vue Query可以讲一讲它们背后的缓存策略和失效机制。没有用过也没关系可以讲自己在项目里是怎么基于业务场景设计缓存方案的关键是逻辑要自洽。4. 项目深挖环节这里才是真正拉开分差的地方4.1 自我介绍和项目介绍必须提前打磨的“开场白”面试的前几分钟面试官通常会让你做个自我介绍。很多人把自我介绍当成“报菜名”——我叫 XX工作了三年之前在 XX 公司负责 XX 项目会 Vue、React、小程序……说完就完了没有留下任何记忆点。我自己的模板是一句话介绍背景我叫 XX三年前端经验主要在电商行业 一句话点出最擅长的方向对复杂表单场景和前端性能优化有比较深的心得 一句话说明当前状态最近离职想找一个业务复杂度更高、技术挑战更大的岗位 一句话抛出项目钩子最近的一个项目里我主导了前端性能优化整体首屏加载时间降低了 60%。这样不到 20 秒面试官已经知道了“这个人做过什么、擅长什么、想做什么”接下来的提问自然会围绕你准备好的项目展开。项目介绍的法则也类似不要从头到尾讲一遍业务流程而是先给一个全景图项目是什么、面向谁、规模多大、你负责哪部分再选一个最有亮点的模块深挖。一定要控制好时间1-2 分钟讲完整体把主动权留给面试官追问。4.2 项目深挖的常见连环问怎么提前准备才不会崩面试官在项目深挖环节通常会顺着你的项目描述一路追问直到问到你答不上来为止。这个过程不是要为难你而是想看你的技术边界在哪里、遇到问题时的思考方式是什么样的。以“我做过一个低代码表单引擎”为例可能的追问链是你说实现了表单引擎它的核心数据结构是什么表单的校验规则是怎么设计成可配置的动态表单联动比如 A 字段的值影响 B 字段是否展示怎么实现如果你现在重新设计这个引擎会有什么改进这条追问链的核心是考察你有没有真正从设计层面思考过问题而不仅仅是调用现成组件。所以面试前一定要对自己简历里的每个项目做一次“自我拷问”如果我是面试官会怎么质疑这个项目的技术方案把这些问题列出来提前想好答案。我在准备的时候为每个项目列了至少 15 个追问问题反复模拟回答。真正面试的时候面试官问的问题大约 70% 都在我的准备范围内剩下的 30% 即使没有直接命中也可以通过已经搭好的思考框架来应对不会手足无措。注意项目深挖环节最忌讳的就是“当时没想太多”或者“这是产品定的需求”。即使真的是这样也要体现出你在拿到需求之后的思考过程你理解了这个需求背后的背景是什么你在实施过程中做了哪些选择结果如何。面试官要看到的是你的思考能力而不是一个“执行机器”。4.3 场景题三年经验的“隐形加试题”大厂面试里场景题的占比越来越高。典型的场景题有“如果让你设计一个前端监控系统你会怎么做”“如何设计一个支持百万并发的商品详情页前端架构”“你的线上页面出现白屏如何快速定位问题”场景题没有标准答案面试官考察的是你的知识广度和解决问题的思路。我的经验是不要急着给方案先确认需求把问题边界搞清楚。比如“百万并发的商品详情页”你要先问清楚是刚需还是峰值是 C 端还是 B 端可用的服务器资源大概是怎样的。把边界聊透了再开始设计方案过程本身就是你能力的展示。设计方案的框架我建议按照“性能 → 可靠性 → 可维护性 → 成本”四个维度展开。性能方面怎么做缓存、怎么拆包、怎么降级可靠性方面怎么做容灾、怎么做监控、怎么做报警可维护性方面代码怎么组织、怎么让团队其他人可以接手成本方面考虑是否有必要上这么复杂的方案。四个维度都覆盖到你的方案就已经比大多数人完整了。场景题还考察“你能不能在信息不完整的情况下做出合理假设并推进”。所以不要因为某些细节没问清楚就卡住可以在回答过程中持续补充假设和理由比如“我假设这里的数据量在百万级理由是……如果达到千万级我会考虑……”。这种回答方式既体现了你的边界感也体现了你思考的弹性。5. 手写题和算法题刷到位比刷得多更重要5.1 前端高频手写题你值得拥有一个自己的“题库”三年经验面试手写题的难度通常是ES5/ES6 的数组方法实现map、filter、reduce、防抖节流、深拷贝、手写 Promise、手写发布订阅、手写 instanceof、手写 Object.create、手写数组去重与扁平化、实现 LazyMan、实现带并发的异步调度器。其中 Promise 相关的手写是重中之重。不仅要能写出 Promise 的基本功能还要掌握 Promise.resolve/Promise.reject/Promise.all/Promise.race 的实现以及如何处理 then 链和错误传播。建议自己从零写一遍再用 Promise/A 规范来对照检查这样不仅面试能用对理解异步编程也有很大帮助。防抖和节流也是高频手写题。考察点不只是“能写出来”还包括“能不能根据边角情况发现问题”。比如防抖有没有处理取消、节流是否支持立即执行选项、this 绑定和参数是否正确。面试官往往会在你的实现基础上加需求比如“如果用户快速点击十次我希望第一次立即执行后面的都防抖掉”这就是对基础实现是否真正理解的检验。深拷贝的考点在于能否处理循环引用、特殊类型Date、RegExp、Map、Set、Symbol、函数以及原型链。只写一个 JSON.parse(JSON.stringify(obj)) 是肯定不够的。推荐整理一个“弱水三千只取一瓢”的精简版本能覆盖大多数场景又不会在面试时因为太长而写崩。提示手写题最重要的是“先说思路再动手写”。很多候选人一拿到题就开始敲代码结果写到一半发现有问题场面非常尴尬。先在脑子里理清楚数据结构是什么、边界条件有哪些、复杂度是多少然后清晰地说出来再动手写。这样即使最后没写完整面试官也能感受到你的思考过程是清晰的。5.2 大厂算法题三年经验该刷到什么程度三年经验的大厂算法面试通常不会出特别难的 hard 题但 medium 高频题是必须熟练的。我的准备策略是把 LeetCode 热门的前 100 道题刷透重点覆盖数组、链表、二叉树、哈希表、双指针、滑动窗口、DFS/BFS、动态规划这八类。不需要追求每天刷很多道但一定要保证每道题都理解透彻能讲清楚复杂度最好能做到举一反三。比如做过“两数之和”就要能想到“三数之和”“四数之和”的解法是什么关系做过“反转链表”就要能同时准备好“K 个一组翻转链表”的思路。还有一个容易忽略的点大厂面试现在越来越喜欢在算法题里融汇前端场景。比如“解析一个 URL 的 query 参数”“实现一个带过期时间的 localStorage 封装”“设计一个支持并发数量限制的请求调度器”。这种题看起来是 JavaScript API本质上是算法数据结构在设计场景里的应用。前端同学如果只会刷纯算法题遇到这种“前端算法题”反而会措手不及所以一定要结合场景练。5.3 Code Review 和代码风格面试中容易被忽略的“隐藏题”有些面试官会在你写完手写题之后突然追问一句“如果这段代码到生产环境里你会担心什么问题”这其实是在考察代码质量和工程意识。这时候你要能指出边界条件是否处理完整、有没有潜在的类型安全问题、异常处理是否到位、性能是否存在隐患、可读性是否足够好。比如手写一个防抖函数可以主动补充“目前没有处理取消场景如果用户切换页面需要手动清理定时器否则可能造成内存泄漏”。这些补充会让面试官觉得你不仅有代码实现能力还有代码审查的敏感度。这也提醒我们平时在团队做 Code Review 的经验不要浪费。面试前把自己最近 review 过的代码或者被 review 出来的典型问题整理一遍都是很好的素材。它们证明你已经开始用“工程师”的视角审视代码而不只是“能跑就行”。6. 软技能和 HR 面临门一脚别掉链子6.1 技术面和 HR 面之间的“隐形关卡”BQ 行为面试在大厂技术面之后通常还会有一轮行为面试Behavioral Question问的问题包括“你遇到过最大的技术难点是什么”“你和产品经理意见不一致时怎么处理”“你有没有带过新人怎么带”。很多人觉得这种问题随便说说就行实际上淘汰率并不低。BQ 的答题框架可以套用 STAR 法则Situation背景、Task任务、Action行动、Result结果。重点在于 Action 部分一定要有“我”的具体行动而不是“我们团队做了什么”。不少候选人会下意识地说“我们项目组当时……”面试官问的其实是你个人的贡献是什么。提前把每个问题都按照 STAR 整理成一个 2-3 分钟的小故事反复练习到自然。BQ 还有一个隐藏考察点遇到问题时的态度。讲一个项目延期或者线上事故的经历时不要甩锅给同事或产品而是重点讲你如何定位问题、如何补救、如何推动流程改进让“坏事”变成体现你责任心和复盘能力的机会。6.2 反问环节展示思考深度的最后机会面试最后基本都会有“你有什么想问我的”环节。很多候选人觉得这就是走流程说句“没有了”就结束了其实很可惜。在技术面和主管面反问是展示你思考深度和对岗位热情的重要机会。可以问的问题包括“这个团队目前最大的技术挑战是什么”“团队对前端工程化有哪些规划”“目前项目里 React/Vue 的使用比例大概是怎样的”“团队今年上半年的技术目标是什么”这些问题既显得你在认真考虑机会也能帮你判断这个团队是否适合自己。不建议问的问题包括你们加班多吗、薪资范围大概多少、我如果进来会负责哪个项目。这类问题不是不能问但放在 HR 面或者 offer 阶段再问更合适技术面问这些容易让面试官觉得你对岗位本身没有太多兴趣。6.3 谈薪、入职时间与 offer 选择不卑不亢最重要如果你走到了 HR 面恭喜你技术关基本已经过了。HR 面的核心任务是薪资谈判和入职时间确认。谈薪的关键是了解市场上三年经验前端的薪资区间结合自己的期望和工作强度需求给出一个合理且有依据的数字。我自己的做法是先定一个“可以接受的最低值”和一个“非常满意的目标值”然后跟 HR 沟通时直接报目标值并给出理由。比如“我目前的总包是 X考虑到新岗位的职责范围更广、加班预期更高我希望总包能到 Y”。如果 HR 压价可以用其他 offer 来对标但要注意措辞得体不要给人“拿 A 压 B”的观感。offer 选择方面不要只看总包数字。团队技术氛围、业务成长性、直属 Leader 的风格、加班强度、公司发展阶段每一项都很重要。我身边有不少朋友为了多两万的总包去了一个技术栈老化、业务停滞的团队一年之后后悔不已。跳槽是长线投资短期的薪资涨幅远没有长期的成长空间值钱。7. 复盘与心态调整7.1 每次面试后花 30 分钟做复盘效果翻倍面试完不是就结束了。我给自己定了一个规矩每次面试结束不管感觉怎么样当天晚上一定要花 30 分钟做复盘。复盘内容只有三个问题今天被问到了哪些问题是我没答好的具体卡在哪个知识点上面试官追问最多的是哪个方向这说明了对方最看重的点是什么今天我有哪些回答是让面试官明显感兴趣的我要不要把这个素材进一步打磨这几轮面试下来我把自己答得不好的问题全部记录在一个文档里分类整理。比如“事件循环 Node 环境下的细节”“React 18 的并发特性本质”“Webpack 构建优化里 cache 的多种用法”。这些问题后来都成了我下一轮面试前快速 review 的复习材料。复盘的收益在第三四场面试时就会明显体现出来——很多第一次没答好的题第二次遇到就能顺畅回答了。7.2 心态管理一周只约两场面试别把自己耗干找工作是一个长期战心态崩掉是很常见的事。我见过不少人一开始热情高涨一天安排两三场面试结果一两周之后就疲了后面面试的质量明显下滑。我自己总结了一个节奏一周最多安排两到三场面试每场面试之间至少留一天的缓冲时间用来复盘和调整。如果真的收到了拒信也不要过度自我怀疑。大厂面试的运气成分真的不低面试官的关注点、当天的题目、甚至你们聊天的气场都会影响结果。挂掉一个岗位不代表你不行可能只是不匹配。把每场面试都当成一次免费的模拟考试心态会稳很多。另外面试期间尽量不要中断自己的工作项目或者学习计划。保持每天写一点代码、读一点源码的习惯会让你在技术面试时保持手感。如果面试碰巧被问到最近的代码实践你还能多一个鲜活的案例。7.3 上篇小结打了三个月的地基才算真正开始冲刺从上文整理到现在这篇“上篇”主要覆盖的是面试前的准备工作简历与投递策略、核心知识考点JS/浏览器/CSS/工程化、框架原理深挖、项目深挖和场景题、手写题与算法准备、软技能与 HR 面、以及复盘和心态管理。与其说这是一篇“面经”不如说是一份“三年经验前端自查清单”。如果你能把每个章节里的问题都回答得基本顺畅你已经有相当强的竞争力了。下篇我会重点展开真实面试中遇到的高频原题和现场作答思路、几个有代表性的项目深挖案例全记录、以及每个面试环节具体的答题话术和表达技巧。这些内容更适合在准备期后半段阅读用来校准和冲刺。以上是我个人在实际面试和准备过程中的真实体会希望能给正在准备跳槽的同行一些参考。 三年经验前端跳槽面试复盘：从准备到实战的全流程指南
做了三年业务前端代码写了不少组件库也攒了一堆但真要迈出跳槽这一步的时候才发现自己脑子里全是糊的。去年下半年我集中面了一圈从中小厂一路面到几家大厂拿了两个 offer也挂了好几轮。这篇文章把整个过程的复盘整理出来分上下两篇。上篇主要讲准备阶段、简历、以及面试里最高频的基础知识考点下篇重点讲框架原理、项目深挖和场景题。先说结论三年经验这个节点面试官看的不再是“你会不会写页面”而是“你有没有形成一套自己的方法论”。知识点当然要背但更重要的是能把知识点串起来能讲清楚每个技术选型背后的 trade-off。这篇面经就是围绕这个目标来写的。1. 简历和投递策略别让面试还没开始就结束了1.1 三年经验简历最容易踩的三个坑三年经验的简历我刷了不下几十份也帮朋友改过不少最常见的坑有三个。第一个坑是把简历写成“项目流水账”。很多人写项目经历就是“负责XX系统开发使用Vue全家桶实现了XX功能”每一条都差不多面试官看完根本记不住你做了什么。正确的做法是每个项目突出 1-2 个有技术难度或业务亮点的点比如“将首屏加载时间从 3.2s 优化到 1.1s核心手段是路由级代码分割 图片懒加载 关键接口预请求”或者“设计了一套可配置的表单引擎让运营同学不需要发版就能上线新活动页”。有数字、有手段、有结果这才是有信息量的项目描述。第二个坑是技能清单写得太多太杂。一会儿写熟悉 Webpack一会儿写熟悉 Vite一会儿又写熟悉 Node.js、TypeScript、小程序、可视化感觉什么都懂。面试官一旦深挖你就会发现每个都是半吊子反而拉低整体评价。建议只写自己真正有底气的 3-5 项核心技能并且标注熟练程度比如“熟练掌握 React 及其周边生态了解 Fiber 架构基本原理”。坦诚一点比虚张声势更能赢得信任。第三个坑是完全没有“亮点前置”。三年经验的简历面试官平均停留时间可能不到 30 秒。一定要把最重要的信息放在最显眼的位置学历、工作年限、核心技能标签、最有代表性的项目最好在简历前三分之一就能让面试官形成“这个人可以约来聊聊”的判断。提示面试官看简历的心态是“找证据”不是“找亮点”。他们希望从你的简历里看到你具备他们岗位需要的能力所以针对不同的岗位 JD简历项目侧重点应该做微调不是一份简历投所有公司。1.2 如何读懂 JD 背后的真实需求很多人投简历是不看 JD 的或者只看了岗位名称和技术栈就投了。三年经验阶段建议把 JD 拆开来看。以“高级前端工程师”常见 JD 为例里面通常包含这些关键词“负责核心业务前端架构设计”“参与前端工程化建设”“优化前端性能”“指导初级工程师”。翻译一下就是希望你能独当一面能解决业务里的复杂问题能推动基础设施完善最好还有一点带人经验。反过来说如果 JD 里写了“负责活动页开发”“配合产品完成需求评审”那大概率是一个执行岗面试难度会低一些但成长空间也有限。根据自己的阶段目标选择合适的岗位比盲目冲大厂 Title 更重要。我见过不少人在 P6/P7 边缘反复横跳最后发现进去之后做的事情和预期完全不符。投递策略上一个比较稳的节奏是先投 3-5 家不太想去的公司练手感受下面试氛围和节奏把自我介绍、项目介绍这些必考题打磨顺了再投目标公司。不要一上来就面最想去的容易因为紧张或者不熟悉流程而挂掉。我自己就是先面了一家中小厂和一家中厂把状态调整好了才去面的最后拿 offer 的两家。1.3 三个月冲刺准备期的精力分配如果你的准备时间是三个月建议按照“基础补全 → 框架源码 → 项目复盘 → 刷题冲刺”四个阶段来安排每个阶段三周左右。基础补全阶段主要过一遍 JS 核心概念闭包、原型链、异步、事件循环、浏览器原理渲染、缓存、安全、网络基础HTTP、HTTPS、TCP、CSS 布局与动画、前端工程化基础。这个阶段的重点是“查漏”哪些知识模棱两可就标记下来后面集中攻克。框架源码阶段选一个主攻框架把核心原理吃透。如果工作用 React就啃 Fiber 架构、Hooks 原理、状态管理方案选型如果工作用 Vue就研究响应式原理、编译优化、运行时设计。同时对比另一个框架的异同这是面试里经常出现的“对比题”。项目复盘阶段把过去三年参与的项目全部梳理一遍每个项目按“背景 → 难点 → 方案 → 结果 → 复盘”五段式整理。这是面试里最不能临时发挥的部分一定要提前写下来反复打磨表达。最后三周是刷题冲刺阶段。算法题重点刷高频题前端手写题也要准备好。这个阶段的节奏是每天保持手感不需要题海战术但要保证见到常见题型能迅速想到思路。2. 三年经验面试的高频考点哪些必须烂熟于心2.1 JS 核心闭包、事件循环和异步方案三年经验面试JS 基础不会再问那种“var 和 let 区别”的入门题了但会在更深的场景里考察你对核心概念的理解。闭包的考察通常不是让你背定义而是结合场景比如“写一个计数器函数每次调用返回自增的数值”“用闭包实现私有变量”“说说闭包的内存泄漏问题以及如何避免”。我遇到过最刁钻的一道题是“闭包里的变量和普通变量在内存分配上有什么区别什么时候闭包的变量会被回收”这个问题光会背“返回函数”是答不好的需要理解执行上下文、词法环境和垃圾回收机制之间的关系。事件循环是大厂必考。考察形式通常是给一段混合了 setTimeout、Promise、async/await 的代码让你写出输出顺序。三年经验不仅要能答对输出顺序还要能解释清楚 microtask 和 macrotask 的优先级、async/await 在事件循环里的特殊处理、以及 Node.js 环境下的 event loop 和浏览器环境有什么区别。建议画一张完整的事件循环示意图存在脑子里面试时可以画给面试官看这是一个很好的加分动作。异步方案的发展脉络也要了解callback → Promise → Generator → async/await。为什么要引入 PromisePromise 解决了什么问题又带来了什么问题async/await 为什么被称为“异步的终极解决方案”。这些演进逻辑比背 API 重要得多因为面试官想听的是你的理解不是背诵。2.2 浏览器原理与性能优化三年经验的必考分水岭“从输入 URL 到页面渲染完成发生了什么”是前端面试的“万金油”题。三年经验阶段这道题的回答深度直接影响面试官对你的定位。初级回答是DNS 解析 → TCP 连接 → 发送 HTTP 请求 → 服务器返回 HTML → 浏览器解析 HTML 构建 DOM 树 → 加载 CSS 构建 CSSOM 树 → 合并渲染树 → 布局 → 绘制。这个回答能拿到及格分但拿不到高分。高分回答要补充的关键细节包括DNS 解析有几步缓存浏览器缓存、系统缓存、路由器缓存、DNS 服务器缓存TCP 建立连接的握手过程、为什么是三次握手HTTP 请求头和响应头里有哪些关键字段Cache-Control、ETag、Connection、Content-Encoding 等渲染进程中主线程如何处理 HTML 解析和脚本执行的关系浏览器遇到 script 标签会阻塞解析所以有 defer 和 asyncCSS 是否会阻塞渲染重排和重绘的区别以及如何减少。围绕性能优化最常被问的问题集中在首屏加载优化怎么做白屏时间、首屏时间、可交互时间这几个指标如何定义和测量前端有哪些常见的性能优化手段对应的原理是什么这里我建议准备一个自己实际做过并产出了可量化收益的优化案例作为核心素材因为面试官大概率会顺着你的回答往深了问。我自己的素材是给公司电商活动页做的一次整体优化先通过 performance 面板定位出首屏最大的性能瓶颈是首屏 JS 执行时间过长然后做了三件事——把首屏非必要的组件全部改为异步加载、将项目从 webpack 的 initial chunk 拆法迁移到基于路由的按需拆包、对图片全部加上响应式尺寸和懒加载。最终首屏 FCP 从 2.8s 降到 1.2sLCP 从 4.1s 降到 2.3s。这个案例在面试里讲了不下十次每次都是面试官追问的重点。2.3 CSS 和工程化容易被忽视但拉开差距的板块三年经验的面试里纯 CSS 布局题考得不多但有一类题几乎每次都会出现“用 CSS 实现一个三角形”“实现两栏布局左边固定右边自适应”“说说 flex 和 grid 的区别什么场景下怎么选”“如何实现主题换肤”。这些题背后的考点其实是你写 CSS 的时候是会用还是真的懂。我总结了一套 CSS 面试的准备思路不用背所有属性但要把盒模型标准盒模型和 IE 盒模型的区别、BFC什么是 BFC、如何触发、解决了什么问题、层叠上下文z-index 为什么有时候会失效这三个基础概念吃透然后熟练掌握 flex 和 grid 的核心属性。做到这一步大部分 CSS 面试题都能应对。工程化方面三年经验最常见的问题包括Webpack 构建流程是怎样的loader 和 plugin 的区别是什么如何做构建性能优化Vite 和 Webpack 的核心差异是什么Babel 的工作原理。这些问题看起来很大但核心其实就是“构建工具到底帮我们做了什么”这一个问题。我建议这里可以准备一个自己优化构建速度的真实案例。比如我们公司的项目用 Webpack 5开发时冷启动要 40 多秒。后来我把 babel-loader 加了 cache 和 thread-loader把不需要解析的第三方库通过 module.noParse 跳过解析又把构建产物做了持久化缓存冷启动时间降到了 12 秒左右。这个案例体现了你不仅会写业务代码还能对工程效率有意识和动手能力面试官通常非常买账。3. 框架原理深挖从使用到理解的必经之路3.1 React 核心原理面试官最常追问的三个方向如果你面的岗位是 React 技术栈有几个问题几乎必问虚拟 DOM 是什么为什么需要虚拟 DOMReact 的渲染流程是怎样的Fiber 架构解决了什么问题。虚拟 DOM 这个问题三年经验不能再停留在“操作真实 DOM 性能差所以用虚拟 DOM”这个浅层认知了。更准确的理解是虚拟 DOM 的价值在于它把“状态 → UI”的映射从命令式的 DOM 操作变成了声明式的状态描述让开发者可以专注于状态管理而把 DOM 操作的细节交给框架。它是一个抽象层带来的是开发效率和可维护性而不仅仅是性能。Fiber 架构是区分“会 React”和“懂 React”的分水岭。你需要能说清楚React 15 的递归渲染存在什么问题一旦开始渲染就不可中断可能导致长时间阻塞主线程Fiber 架构如何通过把渲染工作拆分成可中断的小单元来解决这个问题工作循环work loop是怎么运作的优先级调度lane 模型是怎么回事。不需要把源码每行都背下来但能画出一个整体的流程图并且讲清楚关键节点的设计意图就足以证明你深入研究过。Hooks 原理是另一个高频深挖点。面试官可能会问为什么 Hooks 不能在条件语句里调用useState 和 useReducer 的底层实现有什么区别useEffect 的依赖数组是怎么比较的这些问题的核心都是理解 Hooks 的内部数据结构链表和更新队列。建议有时间的话找一篇讲 Hooks 源码实现的文章配合 React 源码调试一遍把这些概念彻底打通。3.2 Vue 核心原理响应式和编译优化的内功Vue 技术栈的小伙伴同样要对原理有足够深的理解。Vue 3 的响应式实现是基于 Proxy 的而 Vue 2 是基于 Object.defineProperty 的。面试官很可能会问两者有什么区别Proxy 解决了 Vue 2 在响应式上的哪些遗留问题Vue 3 为什么还要提供 ref 和 reactive 两种响应式 API这个问题需要你理解 defineProperty 的两个核心缺陷只能劫持对象属性的 getter/setter无法拦截属性的新增和删除对数组的索引变化和 length 变化无法响应。而 Proxy 直接代理了整个对象天然支持新属性添加和删除监听。但 Proxy 也有代价兼容性要求更高而且在某些场景下对性能有影响。所以 Vue 3 才设计 ref 来解决基础类型值的响应式问题。Vue 3 的编译优化也值得准备。diff 算法从 Vue 2 的全量对比到 Vue 3 的静态标记patchFlag和 block tree性能提升的核心逻辑就是“减少对比范围”。面试的时候能把这个优化思路讲清楚会明显拉开和其他候选人的差距。如果你两个框架都写过那一定要准备一道对比题React 和 Vue 在设计哲学上有什么核心区别我的回答思路是React 更偏向“纯 JS”路线jsx 就是构建 UI 的表达式状态变化后整个组件重新渲染通过 Fiber 调度和协调来保证性能Vue 则采用响应式依赖追踪状态变化时精确更新对应组件同时对模板做编译优化。React 的理念是“你要对渲染过程负责”Vue 则是“框架帮你搞定一切”。这种哲学差异没有对错但能体察到差异本身说明你已经在思考框架的本质了。3.3 状态管理和数据请求业务复杂度的试金石三年经验面试状态管理相关的问题通常是“你们项目为什么选这个方案”“有没有遇到状态管理混乱的问题怎么解决的”。这背后考察的其实是你对业务复杂度的判断力。不需要把所有状态管理库的源码都读一遍但需要形成自己的选型方法论。我的经验是组件间共享状态优先考虑组合/上下文中等复杂度的全局状态用 Zustand 或 Jotai 这类轻量方案心智负担低大型应用才需要考虑 Redux Toolkit 或 Pinia并且要配套思考异步 action、实体关系、持久化等基础设施。你可以不同意这个结论但一定要有自己的思考框架。数据请求方面要熟悉 fetch 和 axios 的差异、如何封装统一的请求层拦截器、错误处理、取消请求、如何处理接口竞态和并发。这里面试官还会问“你是怎么管理接口返回的数据缓存的”如果你用过 React QueryTanStack Query或 Vue Query可以讲一讲它们背后的缓存策略和失效机制。没有用过也没关系可以讲自己在项目里是怎么基于业务场景设计缓存方案的关键是逻辑要自洽。4. 项目深挖环节这里才是真正拉开分差的地方4.1 自我介绍和项目介绍必须提前打磨的“开场白”面试的前几分钟面试官通常会让你做个自我介绍。很多人把自我介绍当成“报菜名”——我叫 XX工作了三年之前在 XX 公司负责 XX 项目会 Vue、React、小程序……说完就完了没有留下任何记忆点。我自己的模板是一句话介绍背景我叫 XX三年前端经验主要在电商行业 一句话点出最擅长的方向对复杂表单场景和前端性能优化有比较深的心得 一句话说明当前状态最近离职想找一个业务复杂度更高、技术挑战更大的岗位 一句话抛出项目钩子最近的一个项目里我主导了前端性能优化整体首屏加载时间降低了 60%。这样不到 20 秒面试官已经知道了“这个人做过什么、擅长什么、想做什么”接下来的提问自然会围绕你准备好的项目展开。项目介绍的法则也类似不要从头到尾讲一遍业务流程而是先给一个全景图项目是什么、面向谁、规模多大、你负责哪部分再选一个最有亮点的模块深挖。一定要控制好时间1-2 分钟讲完整体把主动权留给面试官追问。4.2 项目深挖的常见连环问怎么提前准备才不会崩面试官在项目深挖环节通常会顺着你的项目描述一路追问直到问到你答不上来为止。这个过程不是要为难你而是想看你的技术边界在哪里、遇到问题时的思考方式是什么样的。以“我做过一个低代码表单引擎”为例可能的追问链是你说实现了表单引擎它的核心数据结构是什么表单的校验规则是怎么设计成可配置的动态表单联动比如 A 字段的值影响 B 字段是否展示怎么实现如果你现在重新设计这个引擎会有什么改进这条追问链的核心是考察你有没有真正从设计层面思考过问题而不仅仅是调用现成组件。所以面试前一定要对自己简历里的每个项目做一次“自我拷问”如果我是面试官会怎么质疑这个项目的技术方案把这些问题列出来提前想好答案。我在准备的时候为每个项目列了至少 15 个追问问题反复模拟回答。真正面试的时候面试官问的问题大约 70% 都在我的准备范围内剩下的 30% 即使没有直接命中也可以通过已经搭好的思考框架来应对不会手足无措。注意项目深挖环节最忌讳的就是“当时没想太多”或者“这是产品定的需求”。即使真的是这样也要体现出你在拿到需求之后的思考过程你理解了这个需求背后的背景是什么你在实施过程中做了哪些选择结果如何。面试官要看到的是你的思考能力而不是一个“执行机器”。4.3 场景题三年经验的“隐形加试题”大厂面试里场景题的占比越来越高。典型的场景题有“如果让你设计一个前端监控系统你会怎么做”“如何设计一个支持百万并发的商品详情页前端架构”“你的线上页面出现白屏如何快速定位问题”场景题没有标准答案面试官考察的是你的知识广度和解决问题的思路。我的经验是不要急着给方案先确认需求把问题边界搞清楚。比如“百万并发的商品详情页”你要先问清楚是刚需还是峰值是 C 端还是 B 端可用的服务器资源大概是怎样的。把边界聊透了再开始设计方案过程本身就是你能力的展示。设计方案的框架我建议按照“性能 → 可靠性 → 可维护性 → 成本”四个维度展开。性能方面怎么做缓存、怎么拆包、怎么降级可靠性方面怎么做容灾、怎么做监控、怎么做报警可维护性方面代码怎么组织、怎么让团队其他人可以接手成本方面考虑是否有必要上这么复杂的方案。四个维度都覆盖到你的方案就已经比大多数人完整了。场景题还考察“你能不能在信息不完整的情况下做出合理假设并推进”。所以不要因为某些细节没问清楚就卡住可以在回答过程中持续补充假设和理由比如“我假设这里的数据量在百万级理由是……如果达到千万级我会考虑……”。这种回答方式既体现了你的边界感也体现了你思考的弹性。5. 手写题和算法题刷到位比刷得多更重要5.1 前端高频手写题你值得拥有一个自己的“题库”三年经验面试手写题的难度通常是ES5/ES6 的数组方法实现map、filter、reduce、防抖节流、深拷贝、手写 Promise、手写发布订阅、手写 instanceof、手写 Object.create、手写数组去重与扁平化、实现 LazyMan、实现带并发的异步调度器。其中 Promise 相关的手写是重中之重。不仅要能写出 Promise 的基本功能还要掌握 Promise.resolve/Promise.reject/Promise.all/Promise.race 的实现以及如何处理 then 链和错误传播。建议自己从零写一遍再用 Promise/A 规范来对照检查这样不仅面试能用对理解异步编程也有很大帮助。防抖和节流也是高频手写题。考察点不只是“能写出来”还包括“能不能根据边角情况发现问题”。比如防抖有没有处理取消、节流是否支持立即执行选项、this 绑定和参数是否正确。面试官往往会在你的实现基础上加需求比如“如果用户快速点击十次我希望第一次立即执行后面的都防抖掉”这就是对基础实现是否真正理解的检验。深拷贝的考点在于能否处理循环引用、特殊类型Date、RegExp、Map、Set、Symbol、函数以及原型链。只写一个 JSON.parse(JSON.stringify(obj)) 是肯定不够的。推荐整理一个“弱水三千只取一瓢”的精简版本能覆盖大多数场景又不会在面试时因为太长而写崩。提示手写题最重要的是“先说思路再动手写”。很多候选人一拿到题就开始敲代码结果写到一半发现有问题场面非常尴尬。先在脑子里理清楚数据结构是什么、边界条件有哪些、复杂度是多少然后清晰地说出来再动手写。这样即使最后没写完整面试官也能感受到你的思考过程是清晰的。5.2 大厂算法题三年经验该刷到什么程度三年经验的大厂算法面试通常不会出特别难的 hard 题但 medium 高频题是必须熟练的。我的准备策略是把 LeetCode 热门的前 100 道题刷透重点覆盖数组、链表、二叉树、哈希表、双指针、滑动窗口、DFS/BFS、动态规划这八类。不需要追求每天刷很多道但一定要保证每道题都理解透彻能讲清楚复杂度最好能做到举一反三。比如做过“两数之和”就要能想到“三数之和”“四数之和”的解法是什么关系做过“反转链表”就要能同时准备好“K 个一组翻转链表”的思路。还有一个容易忽略的点大厂面试现在越来越喜欢在算法题里融汇前端场景。比如“解析一个 URL 的 query 参数”“实现一个带过期时间的 localStorage 封装”“设计一个支持并发数量限制的请求调度器”。这种题看起来是 JavaScript API本质上是算法数据结构在设计场景里的应用。前端同学如果只会刷纯算法题遇到这种“前端算法题”反而会措手不及所以一定要结合场景练。5.3 Code Review 和代码风格面试中容易被忽略的“隐藏题”有些面试官会在你写完手写题之后突然追问一句“如果这段代码到生产环境里你会担心什么问题”这其实是在考察代码质量和工程意识。这时候你要能指出边界条件是否处理完整、有没有潜在的类型安全问题、异常处理是否到位、性能是否存在隐患、可读性是否足够好。比如手写一个防抖函数可以主动补充“目前没有处理取消场景如果用户切换页面需要手动清理定时器否则可能造成内存泄漏”。这些补充会让面试官觉得你不仅有代码实现能力还有代码审查的敏感度。这也提醒我们平时在团队做 Code Review 的经验不要浪费。面试前把自己最近 review 过的代码或者被 review 出来的典型问题整理一遍都是很好的素材。它们证明你已经开始用“工程师”的视角审视代码而不只是“能跑就行”。6. 软技能和 HR 面临门一脚别掉链子6.1 技术面和 HR 面之间的“隐形关卡”BQ 行为面试在大厂技术面之后通常还会有一轮行为面试Behavioral Question问的问题包括“你遇到过最大的技术难点是什么”“你和产品经理意见不一致时怎么处理”“你有没有带过新人怎么带”。很多人觉得这种问题随便说说就行实际上淘汰率并不低。BQ 的答题框架可以套用 STAR 法则Situation背景、Task任务、Action行动、Result结果。重点在于 Action 部分一定要有“我”的具体行动而不是“我们团队做了什么”。不少候选人会下意识地说“我们项目组当时……”面试官问的其实是你个人的贡献是什么。提前把每个问题都按照 STAR 整理成一个 2-3 分钟的小故事反复练习到自然。BQ 还有一个隐藏考察点遇到问题时的态度。讲一个项目延期或者线上事故的经历时不要甩锅给同事或产品而是重点讲你如何定位问题、如何补救、如何推动流程改进让“坏事”变成体现你责任心和复盘能力的机会。6.2 反问环节展示思考深度的最后机会面试最后基本都会有“你有什么想问我的”环节。很多候选人觉得这就是走流程说句“没有了”就结束了其实很可惜。在技术面和主管面反问是展示你思考深度和对岗位热情的重要机会。可以问的问题包括“这个团队目前最大的技术挑战是什么”“团队对前端工程化有哪些规划”“目前项目里 React/Vue 的使用比例大概是怎样的”“团队今年上半年的技术目标是什么”这些问题既显得你在认真考虑机会也能帮你判断这个团队是否适合自己。不建议问的问题包括你们加班多吗、薪资范围大概多少、我如果进来会负责哪个项目。这类问题不是不能问但放在 HR 面或者 offer 阶段再问更合适技术面问这些容易让面试官觉得你对岗位本身没有太多兴趣。6.3 谈薪、入职时间与 offer 选择不卑不亢最重要如果你走到了 HR 面恭喜你技术关基本已经过了。HR 面的核心任务是薪资谈判和入职时间确认。谈薪的关键是了解市场上三年经验前端的薪资区间结合自己的期望和工作强度需求给出一个合理且有依据的数字。我自己的做法是先定一个“可以接受的最低值”和一个“非常满意的目标值”然后跟 HR 沟通时直接报目标值并给出理由。比如“我目前的总包是 X考虑到新岗位的职责范围更广、加班预期更高我希望总包能到 Y”。如果 HR 压价可以用其他 offer 来对标但要注意措辞得体不要给人“拿 A 压 B”的观感。offer 选择方面不要只看总包数字。团队技术氛围、业务成长性、直属 Leader 的风格、加班强度、公司发展阶段每一项都很重要。我身边有不少朋友为了多两万的总包去了一个技术栈老化、业务停滞的团队一年之后后悔不已。跳槽是长线投资短期的薪资涨幅远没有长期的成长空间值钱。7. 复盘与心态调整7.1 每次面试后花 30 分钟做复盘效果翻倍面试完不是就结束了。我给自己定了一个规矩每次面试结束不管感觉怎么样当天晚上一定要花 30 分钟做复盘。复盘内容只有三个问题今天被问到了哪些问题是我没答好的具体卡在哪个知识点上面试官追问最多的是哪个方向这说明了对方最看重的点是什么今天我有哪些回答是让面试官明显感兴趣的我要不要把这个素材进一步打磨这几轮面试下来我把自己答得不好的问题全部记录在一个文档里分类整理。比如“事件循环 Node 环境下的细节”“React 18 的并发特性本质”“Webpack 构建优化里 cache 的多种用法”。这些问题后来都成了我下一轮面试前快速 review 的复习材料。复盘的收益在第三四场面试时就会明显体现出来——很多第一次没答好的题第二次遇到就能顺畅回答了。7.2 心态管理一周只约两场面试别把自己耗干找工作是一个长期战心态崩掉是很常见的事。我见过不少人一开始热情高涨一天安排两三场面试结果一两周之后就疲了后面面试的质量明显下滑。我自己总结了一个节奏一周最多安排两到三场面试每场面试之间至少留一天的缓冲时间用来复盘和调整。如果真的收到了拒信也不要过度自我怀疑。大厂面试的运气成分真的不低面试官的关注点、当天的题目、甚至你们聊天的气场都会影响结果。挂掉一个岗位不代表你不行可能只是不匹配。把每场面试都当成一次免费的模拟考试心态会稳很多。另外面试期间尽量不要中断自己的工作项目或者学习计划。保持每天写一点代码、读一点源码的习惯会让你在技术面试时保持手感。如果面试碰巧被问到最近的代码实践你还能多一个鲜活的案例。7.3 上篇小结打了三个月的地基才算真正开始冲刺从上文整理到现在这篇“上篇”主要覆盖的是面试前的准备工作简历与投递策略、核心知识考点JS/浏览器/CSS/工程化、框架原理深挖、项目深挖和场景题、手写题与算法准备、软技能与 HR 面、以及复盘和心态管理。与其说这是一篇“面经”不如说是一份“三年经验前端自查清单”。如果你能把每个章节里的问题都回答得基本顺畅你已经有相当强的竞争力了。下篇我会重点展开真实面试中遇到的高频原题和现场作答思路、几个有代表性的项目深挖案例全记录、以及每个面试环节具体的答题话术和表达技巧。这些内容更适合在准备期后半段阅读用来校准和冲刺。以上是我个人在实际面试和准备过程中的真实体会希望能给正在准备跳槽的同行一些参考。