说实话写这篇面经之前我犹豫了很久。毕竟我自认是个标准的“混子”前端——技术栈以 Vue 为主React 能写但谈不上熟平时写业务代码靠组件库和搜索引擎续命源码看得少、底层原理一问就慌。但年初我确实投了百度而且三轮技术面加一轮 HR 面全程走完了最后还拿到了 offer。所以我把这段经历原原本本整理出来尤其适合那些跟我一样基础不算扎实、又想试试大厂机会的朋友参考。文章会从简历准备、八股复习、每一轮的面试题拆解、答得不好的地方复盘到 HR 谈薪的细节都写清楚。读完你会发现大厂前端面试没有想象中那么玄乎混子也有混子的打法。1. 面试前“混子”是怎么准备简历和复习的1.1 简历怎么写才不显得像混子先说简历。混子前端的简历最容易出现两个问题一个是项目写得像流水账另一个是技术栈堆得太满面试官一深挖就露馅。我的做法是只写两个核心项目但每一个都按“业务背景—我的职责—技术难点—最终效果”四段式来描述而且刻意留了两三个可以深度追问的钩子。比如我写了一个后台管理系统的项目职责里重点提到“负责权限模块的前端实现基于自定义指令和路由守卫完成了按钮级权限控制”。这一句话基本就预判了面试官的追问方向怎么做动态路由、刷新页面权限丢失怎么处理、自定义指令的 binding 参数怎么拿、v-if 和自定义指令在权限控制上谁更合适。这些都是我提前复习过的问题所以不怕被追问。相反如果我写“参与了多个后台系统的开发”这种空话面试官反而不知道从哪儿问起。技术栈这块我建议只写自己真的用过、能在五分钟内讲清楚的。我曾经在简历上写过“熟悉 Webpack 插件开发”结果二面面试官直接问我“loader 和 plugin 的执行时机有什么区别”我当场卡壳。后来我把它改成了“了解 Webpack 常见配置能基于 tapable 编写简单插件”这个说法既诚实又保留了讨论空间。1.2 八股文的复习策略背什么、不背什么八股文是前端面试绕不过去的坎但作为混子盲目把网上流传的几百道题全背一遍是最蠢的做法。我的策略是分了三个优先级只背高频且容易踩坑的内容。第一优先级是框架核心原理尤其是响应式系统、虚拟 DOM、diff 算法这些。Vue 2 的 Object.defineProperty、Vue 3 的 Proxy 实现差异生命周期触发时机key 在 diff 中的作用这些几乎是百度前端面试必问的内容属于不背不行的硬骨头。第二优先级是 JavaScript 语言特性和浏览器原理。闭包、事件循环、Promise 执行顺序、原型链、垃圾回收、浏览器渲染流程、重排重绘这些内容虽然多但有一个特点套路固定。只要把核心逻辑理解了面试时用自己的话复述也不会太差。第三优先级是网络和工程化包括 HTTP 缓存、HTTPS 握手过程、TCP 三次握手、Webpack 构建流程、Vite 为什么比 Webpack 快。这部分我建议理解为主不要死记数字和步骤因为面试官喜欢换个姿势问比如“如果用户访问页面资源总是 304可能是什么原因”。至于 Node.js、SSR、Canvas、WebAssembly 这些我只做到了解概念的程度不深挖。作为混子我们的目标不是每个问题都答得完美而是把核心题稳住遇到不会的能给出合理的分析思路。2. 百度前端面试流程全记录2.1 一面基础能力面题量不多但步步紧逼百度的面试流程通常是三到四轮技术面加一轮 HR 面整体节奏紧凑每轮之间间隔两三天。一面偏基础但绝不是简单地问“什么是闭包”而是会结合具体场景层层追问。我一面大概持续了 50 分钟前 20 分钟在聊项目后面 30 分钟全部是代码题和基础题。项目部分面试官先让我介绍那个权限管理项目然后问了几个细节动态路由的方案、按钮权限的实现方式、如果后端返回的权限列表变了前端怎么响应。因为我提前准备过这部分回答得比较顺。代码题部分面试官给了一道挺经典的输出题让我说出下面这段代码的执行顺序async function asyncTest() { console.log(A) await Promise.resolve() console.log(B) } setTimeout(() console.log(C), 0) asyncTest() console.log(D)答案是 A、D、B、C。这道题核心考察事件循环和微任务队列我答出来了接着面试官追问“如果 Promise.resolve() 换成 Promise.resolve().then(() console.log(E))执行顺序会怎么变”这就要落实到微任务之间的嵌套队列关系。说实话这个点我一开始有点绕但凭印象答对了。基础题部分问了 Vue 的响应式原理我老老实实把 Object.defineProperty 的 getter/setter、依赖收集、Watcher 派发更新讲了一遍。面试官又问 Vue 3 为什么改成 Proxy我补充了 Proxy 可以监听新增属性和删除属性、性能更好、支持 Map/Set 等原生类型这几个点。2.2 二面工程化与项目深挖开始上强度二面明显比一面难面试官看起来像团队里的技术骨干问题也更贴近实际开发场景。开场他先让我描述最近做的一个项目里最有技术含量的部分。我说了一个上传大文件断点续传的功能重点讲了怎么用 Blob.slice 切分文件、怎么利用 web worker 计算文件哈希、并发上传怎么控制、失败重试的策略。面试官立刻追问了几个点为什么用 web worker 而不是主线程直接算哈希、如果用户上传了相同的文件怎么做到秒传、并发数量怎么确定、上传过程中页面切后台怎么办。这几个问题我大部分答上来了但并发数怎么确定我一开始说是“拍脑袋定的 5”面试官明显不满意后来我补了一句“需要根据文件大小和带宽测试来确定同时要考虑浏览器同域并发限制”才算圆过去。接下来是工程化问题。面试官让我说说 Webpack 构建一个项目从入口到输出经历了哪些阶段。我从 entry 开始讲配置了 loader 和 plugin然后是 module 解析、依赖收集、chunk 生成、打包输出。又问 Vite 为什么启动快我回答是因为 Vite 基于原生 ESM开发环境下不需要打包全部模块而是按需加载。面试官点头后接着问“那你觉得 Vite 做生产构建为什么还要用 Rollup”这个问题我答得一般只说了 Rollup 对 tree-shaking 支持更好其实还可以补充生态成熟度和产物体积优化方面的原因。二面最后有两道手写题一道是手写深拷贝要求考虑 Symbol、函数、循环引用另一道是手写一个防抖函数。深拷贝我写出了基础版本循环引用用 WeakMap 解决了但 Symbol 的处理我没写完整。防抖倒是写得很顺。2.3 三面交叉面与主管面更多是聊设计思路三面是交叉面面试官不是前端团队的人问题反而更宏观。他先问了我“当你拿到一个大型项目的需求时你会怎么评估技术方案”这种问题其实没有标准答案拼的是思维框架。我按需求分析、技术选型、风险预估、开发排期这个顺序讲了自己的思路中间穿插了很多之前做过的业务案例。面试官又追问“如果项目已经上线了线上出现白屏你怎么排查”这个题目我答得比较全先看用户报错信息再检查网络请求、控制台报错、资源加载是否正常用 SourceMap 定位具体代码行必要时做灰度回滚。主管面最后问了职业规划和为什么想来百度。这种问题我一般不会只说“想学习”而是结合自己的技术方向讲比如想做前端工程化方向希望在一个大规模项目里锻炼性能优化和架构设计能力。3. 高频考点逐个拆解百度这几类题出现概率极高3.1 框架底层Vue/React 的响应式与 diff 是祖宗题不管面哪个团队Vue 响应式原理几乎是必问的。这个知识点有标准答案但想拿高分需要把链路说得完整。我总结的回答路径是数据初始化时通过 Object.defineProperty 或 Proxy 给 data 的每个属性加 getter 和 setter组件渲染时访问属性触发 getter把当前 Watcher 收集进依赖列表数据修改时触发 setter通知所有依赖的 Watcher 调用 update触发重新渲染。diff 算法也要准备充分要能说清楚同层比较、双端指针、key 的作用。面试官经常反问“为什么不用 index 做 key”这个问题要能解释当列表顺序变化或中间插入元素时index 会匹配错节点导致复用错误最直观的表现就是列表项的状态错乱比如输入框的值被带到其他行。React 方向如果被问到重点复习 hooks 的依赖数组和 Fiber 架构的基本概念。不过百度很多团队以 Vue 为主React 的问题通常会比较浅不会太深入源码层面。3.2 JavaScript 核心与浏览器原理闭包、事件循环、渲染进程JavaScript 基础题是筛查“混子”的重灾区因为这些东西面试官能一个接一个地追问到你答不上为止。我建议把闭包的几种经典场景、立即执行函数、防抖节流的区别背得滚瓜烂熟这不是死背而是理解了之后能瞬间说出应用场景。事件循环是必考题而且一定会和 Promise、setTimeout、requestAnimationFrame 混在一起考。我踩过最大的坑是把 requestAnimationFrame 当作宏任务来回答其实它有自己的执行时机是在下一次绘制之前执行。面试官问“页面滚动时频繁触发事件怎么优化”我把防抖、节流、requestAnimationFrame 三种方案都列出来分别说明了适用场景。浏览器原理部分至少要能画出从输入 URL 到页面渲染的完整流程说清楚 DOM 构建、CSSOM 构建、渲染树合成、布局、绘制、合成这几个步骤并解释哪些操作会触发重排、哪些会触发重绘、哪些可以通过 transform 和 opacity 走合成器避免影响性能。3.3 性能优化与工程化内容多但套路固定性能优化几乎是所有面经里出现频率最高的一类题。我的复习思路是把它按“加载性能、运行时性能、感知性能”三个维度来组织。加载性能就是资源体积和请求数量从代码压缩、Tree Shaking、按需加载、CDN 部署、HTTP 缓存、gzip 或 Brotli 压缩几个角度答。运行时性能包括减少重排重绘、虚拟列表、Web Worker 处理大数据任务、避免内存泄漏。感知性能包括骨架屏、懒加载、资源预加载、关键 CSS 内联。这里给混子一个建议不要背一堆优化名词要结合真实项目聊。比如我聊过“首屏时间从 3 秒优化到 1.5 秒”的经历这个数字是有说服力的面试官会很愿意听你是怎么做的、量化结果是什么。3.4 微前端与技术趋势有了解就加分微前端是百度前端面试里的加分项尤其如果团队本身有大型后台产品大概率会聊到。最核心的是要理解微前端的价值解决巨石应用的拆分问题让不同团队可以独立开发、独立部署、技术栈无关。面试官常问 qiankun 的实现原理我总结的答法是基于 single-spa 的 JS 沙箱和 HTML Entry。JS 沙箱通过 Proxy 实现对 window 对象的代理隔离子应用对全局变量的修改HTML Entry 是 qiankun 的核心思路由框架去加载子应用的 HTML解析出 script 和 style 再逐个执行。另外要了解样式隔离的常见方案比如 scoped、CSS Module、shadow DOM 的取舍。其他新兴方向像 Server Components、Rust 化的前端工具链、AI 辅助开发工具只要做到“知道是干什么的、能说出两个优点和两个痛点”就够了不用太深。4. 复盘面试官到底在考察什么4.1 从问题猜考察意图别只顾着背答案面试后期我复盘时发现很多问题本身不是问题而是一个考察支架。比如面试官问“你了解 DOM diff 吗”表面上考算法实际上在考察你对框架底层原理的理解程度他又追问“为什么 key 不建议用 index”这时候才是在考察你能不能把原理映射到实际开发中的问题。所以我的建议是听到问题先停一秒想想面试官想通过这个问题确认你具备什么能力。如果是考原理就答原理如果是考思路多花时间讲思考过程而不是赶着给结论。很多混子面试失败不是不会而是没弄清考察方向导致答偏了。4.2 手写代码题不会不要紧思路一定要清晰手写题是混子最怕的环节但百度的手写题难度并没有网上传的那么离谱大多数是防抖、节流、深拷贝、Promise.all、数组去重、LRU 缓存这个级别。我的经验是手写题中最重要的不是写出完美答案而是让面试官看到你的思考过程。先读题确认边界条件然后说思路再动手写。比如写深拷贝之前我先说“这个函数要考虑基本类型的直接返回、数组和对象的递归处理、函数和 Symbol 的特殊情况、循环引用避免栈溢出”面试官会认为你思路完整哪怕某段代码没写全分数也不会太低。另外写代码时记得和面试官保持沟通边写边解释每段的意图。沉默式写代码是面试大忌哪怕你写得对面试官也无法确认这到底是你背的还是理解的。4.3 反问环节混子也要问出有效问题很多面经会告诉你最后一定要反问但没告诉你怎么反问才不算浪费机会。我梳理了三个我认为最有效的问题方向一是问团队技术栈和未来规划二是问团队当前最大的技术挑战三是问入职后前三个月的工作重点。这三个方向既能帮你了解真实工作内容又能让面试官觉得你对岗位有认真思考。我是在主管面反问团队怎么处理多个子应用之间的公共依赖管理面试官觉得这个问题切中了微前端的痛点后来聊了挺久。不要问“公司加班多吗”“年终奖几个月”这种问题留到 HR 面再谈。5. 混子避坑指南这些雷我替你踩过了5.1 简历上写的每一项都要准备一个“一分钟深度说明”这是一个我付出过代价的教训。我简历上写了“熟练使用 TypeScript”二面面试官直接问“type 和 interface 有什么区别什么时候用哪个”。我当时只答了“interface 可以合并声明type 更灵活”完全没有展开。正确的展开方式是type 适合定义联合类型、交叉类型和元组interface 更适合描述对象的形状因为它可以被重复声明合并也更容易被类实现。在写公共组件库或 API 类型定义时优先用 interface在需要复杂类型运算时用 type。如果后续面试官再针对这个问题追问“什么时候这两个定义会产生类型冲突”还能结合 TS 的声明合并规则解释。只要面试官一个问题你答浅了他就会默认这个知识点你只是“知道概念”而不是“真正用过”。5.2 HR 面和谈薪阶段技术面过关了也别掉以轻心技术面全过了之后HR 面也不能放松警惕。HR 会考察你的稳定性、沟通能力、对公司的意向程度还会跟你谈薪。我 HR 面遇到的几个问题包括为什么离开上一家公司、为什么选择百度、期望薪资是多少、有没有其他 offer。谈薪这里给混子的建议是先了解行情再设定一个底线和一个期望值。不要一上来就报一个特别高的数字也不要因为心虚就说“你们看着给”。我自己的策略是报了一个比当前薪资高 25% 的期望值同时说明了原由结合当前市场行情和个人能力定位。HR 后续压了一些但我守住了底线最后拿到的 package 在我的预期区间内。另外一个容易被忽略的点HR 面也会记录反馈并且会影响最终 offer 审批。所以哪怕到了这个环节也不要暴露“进大厂是为了镀金就走”这种不稳定信号。表达职业规划的时候尽量落在长期发展上。5.3 时间线拉长后的心态管理百度整个面试流程从投简历到 offer 审批大概持续了一个多月中间有焦虑期和等待期。我最大的感受是面试过程中的心态管理有时候比技术准备更重要。每次面完不管好坏我会花半小时复盘记录下哪些问题答得不好、哪些问题的回答当时觉得自己发挥不错但事后看还能补充深度。等到约下一轮面试之前优先看这份复盘清单避免在同一类坑里反复掉进去。等 offer 的那一周我本来已经有点想放弃了结果 HR 电话就来了。所以我想对打算投大厂的混子朋友说面试发挥有波动很正常别因为一面被追问卡壳就自我否定面完立刻补漏才是关键。最后再分享一个实操细节面试前一定要花一两个晚上把高频手写题自己敲一遍别只看答案。我的做法是用一个空目录建了几个 HTML 文件把深拷贝、防抖节流、Promise.all、LRU 缓存每道题自己实现一遍然后跑测试用例验证边界。为什么这么做因为很多时候你觉得自己会了但真的坐到面试官对面在白板或在线编辑器上写代码的时候手是会生疏的。还有一个小技巧是用手机录像模拟面试自己对着镜头讲一遍项目亮点和 Vue 响应式原理听回放你会发现很多你以为讲得清楚的地方其实逻辑跳跃。这个方法特别适合表达容易混乱的混子型选手。说实话我依然是那个写业务靠组件库、闲下来也不太爱研究源码的普通前端。但经过这次面试我意识到混子和工作年限无关关键在于肯不肯在面试前把常见的坑都补一遍。希望你也能拿到心仪的 offer。 混子前端百度面经：从简历、八股到HR谈薪全复盘
说实话写这篇面经之前我犹豫了很久。毕竟我自认是个标准的“混子”前端——技术栈以 Vue 为主React 能写但谈不上熟平时写业务代码靠组件库和搜索引擎续命源码看得少、底层原理一问就慌。但年初我确实投了百度而且三轮技术面加一轮 HR 面全程走完了最后还拿到了 offer。所以我把这段经历原原本本整理出来尤其适合那些跟我一样基础不算扎实、又想试试大厂机会的朋友参考。文章会从简历准备、八股复习、每一轮的面试题拆解、答得不好的地方复盘到 HR 谈薪的细节都写清楚。读完你会发现大厂前端面试没有想象中那么玄乎混子也有混子的打法。1. 面试前“混子”是怎么准备简历和复习的1.1 简历怎么写才不显得像混子先说简历。混子前端的简历最容易出现两个问题一个是项目写得像流水账另一个是技术栈堆得太满面试官一深挖就露馅。我的做法是只写两个核心项目但每一个都按“业务背景—我的职责—技术难点—最终效果”四段式来描述而且刻意留了两三个可以深度追问的钩子。比如我写了一个后台管理系统的项目职责里重点提到“负责权限模块的前端实现基于自定义指令和路由守卫完成了按钮级权限控制”。这一句话基本就预判了面试官的追问方向怎么做动态路由、刷新页面权限丢失怎么处理、自定义指令的 binding 参数怎么拿、v-if 和自定义指令在权限控制上谁更合适。这些都是我提前复习过的问题所以不怕被追问。相反如果我写“参与了多个后台系统的开发”这种空话面试官反而不知道从哪儿问起。技术栈这块我建议只写自己真的用过、能在五分钟内讲清楚的。我曾经在简历上写过“熟悉 Webpack 插件开发”结果二面面试官直接问我“loader 和 plugin 的执行时机有什么区别”我当场卡壳。后来我把它改成了“了解 Webpack 常见配置能基于 tapable 编写简单插件”这个说法既诚实又保留了讨论空间。1.2 八股文的复习策略背什么、不背什么八股文是前端面试绕不过去的坎但作为混子盲目把网上流传的几百道题全背一遍是最蠢的做法。我的策略是分了三个优先级只背高频且容易踩坑的内容。第一优先级是框架核心原理尤其是响应式系统、虚拟 DOM、diff 算法这些。Vue 2 的 Object.defineProperty、Vue 3 的 Proxy 实现差异生命周期触发时机key 在 diff 中的作用这些几乎是百度前端面试必问的内容属于不背不行的硬骨头。第二优先级是 JavaScript 语言特性和浏览器原理。闭包、事件循环、Promise 执行顺序、原型链、垃圾回收、浏览器渲染流程、重排重绘这些内容虽然多但有一个特点套路固定。只要把核心逻辑理解了面试时用自己的话复述也不会太差。第三优先级是网络和工程化包括 HTTP 缓存、HTTPS 握手过程、TCP 三次握手、Webpack 构建流程、Vite 为什么比 Webpack 快。这部分我建议理解为主不要死记数字和步骤因为面试官喜欢换个姿势问比如“如果用户访问页面资源总是 304可能是什么原因”。至于 Node.js、SSR、Canvas、WebAssembly 这些我只做到了解概念的程度不深挖。作为混子我们的目标不是每个问题都答得完美而是把核心题稳住遇到不会的能给出合理的分析思路。2. 百度前端面试流程全记录2.1 一面基础能力面题量不多但步步紧逼百度的面试流程通常是三到四轮技术面加一轮 HR 面整体节奏紧凑每轮之间间隔两三天。一面偏基础但绝不是简单地问“什么是闭包”而是会结合具体场景层层追问。我一面大概持续了 50 分钟前 20 分钟在聊项目后面 30 分钟全部是代码题和基础题。项目部分面试官先让我介绍那个权限管理项目然后问了几个细节动态路由的方案、按钮权限的实现方式、如果后端返回的权限列表变了前端怎么响应。因为我提前准备过这部分回答得比较顺。代码题部分面试官给了一道挺经典的输出题让我说出下面这段代码的执行顺序async function asyncTest() { console.log(A) await Promise.resolve() console.log(B) } setTimeout(() console.log(C), 0) asyncTest() console.log(D)答案是 A、D、B、C。这道题核心考察事件循环和微任务队列我答出来了接着面试官追问“如果 Promise.resolve() 换成 Promise.resolve().then(() console.log(E))执行顺序会怎么变”这就要落实到微任务之间的嵌套队列关系。说实话这个点我一开始有点绕但凭印象答对了。基础题部分问了 Vue 的响应式原理我老老实实把 Object.defineProperty 的 getter/setter、依赖收集、Watcher 派发更新讲了一遍。面试官又问 Vue 3 为什么改成 Proxy我补充了 Proxy 可以监听新增属性和删除属性、性能更好、支持 Map/Set 等原生类型这几个点。2.2 二面工程化与项目深挖开始上强度二面明显比一面难面试官看起来像团队里的技术骨干问题也更贴近实际开发场景。开场他先让我描述最近做的一个项目里最有技术含量的部分。我说了一个上传大文件断点续传的功能重点讲了怎么用 Blob.slice 切分文件、怎么利用 web worker 计算文件哈希、并发上传怎么控制、失败重试的策略。面试官立刻追问了几个点为什么用 web worker 而不是主线程直接算哈希、如果用户上传了相同的文件怎么做到秒传、并发数量怎么确定、上传过程中页面切后台怎么办。这几个问题我大部分答上来了但并发数怎么确定我一开始说是“拍脑袋定的 5”面试官明显不满意后来我补了一句“需要根据文件大小和带宽测试来确定同时要考虑浏览器同域并发限制”才算圆过去。接下来是工程化问题。面试官让我说说 Webpack 构建一个项目从入口到输出经历了哪些阶段。我从 entry 开始讲配置了 loader 和 plugin然后是 module 解析、依赖收集、chunk 生成、打包输出。又问 Vite 为什么启动快我回答是因为 Vite 基于原生 ESM开发环境下不需要打包全部模块而是按需加载。面试官点头后接着问“那你觉得 Vite 做生产构建为什么还要用 Rollup”这个问题我答得一般只说了 Rollup 对 tree-shaking 支持更好其实还可以补充生态成熟度和产物体积优化方面的原因。二面最后有两道手写题一道是手写深拷贝要求考虑 Symbol、函数、循环引用另一道是手写一个防抖函数。深拷贝我写出了基础版本循环引用用 WeakMap 解决了但 Symbol 的处理我没写完整。防抖倒是写得很顺。2.3 三面交叉面与主管面更多是聊设计思路三面是交叉面面试官不是前端团队的人问题反而更宏观。他先问了我“当你拿到一个大型项目的需求时你会怎么评估技术方案”这种问题其实没有标准答案拼的是思维框架。我按需求分析、技术选型、风险预估、开发排期这个顺序讲了自己的思路中间穿插了很多之前做过的业务案例。面试官又追问“如果项目已经上线了线上出现白屏你怎么排查”这个题目我答得比较全先看用户报错信息再检查网络请求、控制台报错、资源加载是否正常用 SourceMap 定位具体代码行必要时做灰度回滚。主管面最后问了职业规划和为什么想来百度。这种问题我一般不会只说“想学习”而是结合自己的技术方向讲比如想做前端工程化方向希望在一个大规模项目里锻炼性能优化和架构设计能力。3. 高频考点逐个拆解百度这几类题出现概率极高3.1 框架底层Vue/React 的响应式与 diff 是祖宗题不管面哪个团队Vue 响应式原理几乎是必问的。这个知识点有标准答案但想拿高分需要把链路说得完整。我总结的回答路径是数据初始化时通过 Object.defineProperty 或 Proxy 给 data 的每个属性加 getter 和 setter组件渲染时访问属性触发 getter把当前 Watcher 收集进依赖列表数据修改时触发 setter通知所有依赖的 Watcher 调用 update触发重新渲染。diff 算法也要准备充分要能说清楚同层比较、双端指针、key 的作用。面试官经常反问“为什么不用 index 做 key”这个问题要能解释当列表顺序变化或中间插入元素时index 会匹配错节点导致复用错误最直观的表现就是列表项的状态错乱比如输入框的值被带到其他行。React 方向如果被问到重点复习 hooks 的依赖数组和 Fiber 架构的基本概念。不过百度很多团队以 Vue 为主React 的问题通常会比较浅不会太深入源码层面。3.2 JavaScript 核心与浏览器原理闭包、事件循环、渲染进程JavaScript 基础题是筛查“混子”的重灾区因为这些东西面试官能一个接一个地追问到你答不上为止。我建议把闭包的几种经典场景、立即执行函数、防抖节流的区别背得滚瓜烂熟这不是死背而是理解了之后能瞬间说出应用场景。事件循环是必考题而且一定会和 Promise、setTimeout、requestAnimationFrame 混在一起考。我踩过最大的坑是把 requestAnimationFrame 当作宏任务来回答其实它有自己的执行时机是在下一次绘制之前执行。面试官问“页面滚动时频繁触发事件怎么优化”我把防抖、节流、requestAnimationFrame 三种方案都列出来分别说明了适用场景。浏览器原理部分至少要能画出从输入 URL 到页面渲染的完整流程说清楚 DOM 构建、CSSOM 构建、渲染树合成、布局、绘制、合成这几个步骤并解释哪些操作会触发重排、哪些会触发重绘、哪些可以通过 transform 和 opacity 走合成器避免影响性能。3.3 性能优化与工程化内容多但套路固定性能优化几乎是所有面经里出现频率最高的一类题。我的复习思路是把它按“加载性能、运行时性能、感知性能”三个维度来组织。加载性能就是资源体积和请求数量从代码压缩、Tree Shaking、按需加载、CDN 部署、HTTP 缓存、gzip 或 Brotli 压缩几个角度答。运行时性能包括减少重排重绘、虚拟列表、Web Worker 处理大数据任务、避免内存泄漏。感知性能包括骨架屏、懒加载、资源预加载、关键 CSS 内联。这里给混子一个建议不要背一堆优化名词要结合真实项目聊。比如我聊过“首屏时间从 3 秒优化到 1.5 秒”的经历这个数字是有说服力的面试官会很愿意听你是怎么做的、量化结果是什么。3.4 微前端与技术趋势有了解就加分微前端是百度前端面试里的加分项尤其如果团队本身有大型后台产品大概率会聊到。最核心的是要理解微前端的价值解决巨石应用的拆分问题让不同团队可以独立开发、独立部署、技术栈无关。面试官常问 qiankun 的实现原理我总结的答法是基于 single-spa 的 JS 沙箱和 HTML Entry。JS 沙箱通过 Proxy 实现对 window 对象的代理隔离子应用对全局变量的修改HTML Entry 是 qiankun 的核心思路由框架去加载子应用的 HTML解析出 script 和 style 再逐个执行。另外要了解样式隔离的常见方案比如 scoped、CSS Module、shadow DOM 的取舍。其他新兴方向像 Server Components、Rust 化的前端工具链、AI 辅助开发工具只要做到“知道是干什么的、能说出两个优点和两个痛点”就够了不用太深。4. 复盘面试官到底在考察什么4.1 从问题猜考察意图别只顾着背答案面试后期我复盘时发现很多问题本身不是问题而是一个考察支架。比如面试官问“你了解 DOM diff 吗”表面上考算法实际上在考察你对框架底层原理的理解程度他又追问“为什么 key 不建议用 index”这时候才是在考察你能不能把原理映射到实际开发中的问题。所以我的建议是听到问题先停一秒想想面试官想通过这个问题确认你具备什么能力。如果是考原理就答原理如果是考思路多花时间讲思考过程而不是赶着给结论。很多混子面试失败不是不会而是没弄清考察方向导致答偏了。4.2 手写代码题不会不要紧思路一定要清晰手写题是混子最怕的环节但百度的手写题难度并没有网上传的那么离谱大多数是防抖、节流、深拷贝、Promise.all、数组去重、LRU 缓存这个级别。我的经验是手写题中最重要的不是写出完美答案而是让面试官看到你的思考过程。先读题确认边界条件然后说思路再动手写。比如写深拷贝之前我先说“这个函数要考虑基本类型的直接返回、数组和对象的递归处理、函数和 Symbol 的特殊情况、循环引用避免栈溢出”面试官会认为你思路完整哪怕某段代码没写全分数也不会太低。另外写代码时记得和面试官保持沟通边写边解释每段的意图。沉默式写代码是面试大忌哪怕你写得对面试官也无法确认这到底是你背的还是理解的。4.3 反问环节混子也要问出有效问题很多面经会告诉你最后一定要反问但没告诉你怎么反问才不算浪费机会。我梳理了三个我认为最有效的问题方向一是问团队技术栈和未来规划二是问团队当前最大的技术挑战三是问入职后前三个月的工作重点。这三个方向既能帮你了解真实工作内容又能让面试官觉得你对岗位有认真思考。我是在主管面反问团队怎么处理多个子应用之间的公共依赖管理面试官觉得这个问题切中了微前端的痛点后来聊了挺久。不要问“公司加班多吗”“年终奖几个月”这种问题留到 HR 面再谈。5. 混子避坑指南这些雷我替你踩过了5.1 简历上写的每一项都要准备一个“一分钟深度说明”这是一个我付出过代价的教训。我简历上写了“熟练使用 TypeScript”二面面试官直接问“type 和 interface 有什么区别什么时候用哪个”。我当时只答了“interface 可以合并声明type 更灵活”完全没有展开。正确的展开方式是type 适合定义联合类型、交叉类型和元组interface 更适合描述对象的形状因为它可以被重复声明合并也更容易被类实现。在写公共组件库或 API 类型定义时优先用 interface在需要复杂类型运算时用 type。如果后续面试官再针对这个问题追问“什么时候这两个定义会产生类型冲突”还能结合 TS 的声明合并规则解释。只要面试官一个问题你答浅了他就会默认这个知识点你只是“知道概念”而不是“真正用过”。5.2 HR 面和谈薪阶段技术面过关了也别掉以轻心技术面全过了之后HR 面也不能放松警惕。HR 会考察你的稳定性、沟通能力、对公司的意向程度还会跟你谈薪。我 HR 面遇到的几个问题包括为什么离开上一家公司、为什么选择百度、期望薪资是多少、有没有其他 offer。谈薪这里给混子的建议是先了解行情再设定一个底线和一个期望值。不要一上来就报一个特别高的数字也不要因为心虚就说“你们看着给”。我自己的策略是报了一个比当前薪资高 25% 的期望值同时说明了原由结合当前市场行情和个人能力定位。HR 后续压了一些但我守住了底线最后拿到的 package 在我的预期区间内。另外一个容易被忽略的点HR 面也会记录反馈并且会影响最终 offer 审批。所以哪怕到了这个环节也不要暴露“进大厂是为了镀金就走”这种不稳定信号。表达职业规划的时候尽量落在长期发展上。5.3 时间线拉长后的心态管理百度整个面试流程从投简历到 offer 审批大概持续了一个多月中间有焦虑期和等待期。我最大的感受是面试过程中的心态管理有时候比技术准备更重要。每次面完不管好坏我会花半小时复盘记录下哪些问题答得不好、哪些问题的回答当时觉得自己发挥不错但事后看还能补充深度。等到约下一轮面试之前优先看这份复盘清单避免在同一类坑里反复掉进去。等 offer 的那一周我本来已经有点想放弃了结果 HR 电话就来了。所以我想对打算投大厂的混子朋友说面试发挥有波动很正常别因为一面被追问卡壳就自我否定面完立刻补漏才是关键。最后再分享一个实操细节面试前一定要花一两个晚上把高频手写题自己敲一遍别只看答案。我的做法是用一个空目录建了几个 HTML 文件把深拷贝、防抖节流、Promise.all、LRU 缓存每道题自己实现一遍然后跑测试用例验证边界。为什么这么做因为很多时候你觉得自己会了但真的坐到面试官对面在白板或在线编辑器上写代码的时候手是会生疏的。还有一个小技巧是用手机录像模拟面试自己对着镜头讲一遍项目亮点和 Vue 响应式原理听回放你会发现很多你以为讲得清楚的地方其实逻辑跳跃。这个方法特别适合表达容易混乱的混子型选手。说实话我依然是那个写业务靠组件库、闲下来也不太爱研究源码的普通前端。但经过这次面试我意识到混子和工作年限无关关键在于肯不肯在面试前把常见的坑都补一遍。希望你也能拿到心仪的 offer。