2025 年准备百度前端岗位的面试要复习的东西是真的多。我在过去几个月里把近两年百度前端相关的面经、公开题库和身边朋友的真实反馈翻了个遍自己也按大厂节奏模拟了好几轮最终整理出一份围绕高频题型的备考清单。这篇文章不是让你生背题目而是把每个高频考点背后的思考逻辑、常见追问方式以及那些只有实战过才会知道的坑一条条拉出来拆开讲。不管你是准备校招、社招还是单纯想做一次系统性复盘这份内容都值得你花点时间慢慢看。1. 百度前端面试到底在考什么1.1 面试轮次与整体节奏百度的前端面试流程通常比较稳定简历筛选之后先来一轮电话沟通或者在线笔试然后进入技术一面、二面走到最后一般会有主管面或交叉面最后是 HR 面。笔试环节多数是算法题加前端基础题有些部门会直接发在线编程链接题量不大但覆盖面很广时间卡得也比较紧。电话面很多时候是技术初筛主要聊项目、聊基础比如随手问你对 React 和 Vue 的理解、事件循环、项目难点。一面开始进入正题面试官会从 JavaScript 基础、浏览器原理、框架原理、网络、工程化这几个方向交叉提问。二面则更偏项目深挖、设计思路、疑难问题排查有时还会抛出一个开放场景让你现场给方案。到了主管面重点会转向技术视野、团队协作能力和解决问题的思路。不同部门会有差异但整体逻辑差不多。1.2 大厂面试官的考核逻辑是什么表面上看面试是围绕知识点提问实际上面试官在验证三个底层能力。第一个是“从现象到原理”的还原能力。很多题目都会从一个线上问题切入比如“页面白屏你怎么排查”“首屏加载慢你会怎么做”。这时候真正想听的不是你背过的答案而是你能不能在心里画出浏览器从输入 URL 到页面渲染的完整链路然后逐层定位问题。能把白屏拆成网络没回来、资源加载失败、JS 报错、渲染阻塞等几个可能方向再给出对应排查工具这种回答才是合格的。第二个是“方案的权衡能力”。前端工程里几乎没有绝对正确的唯一解面试官故意抛出一个两难问题比如“组件库要不要统一”“微前端选 qiankun 还是 wujie”“图片用 CDN 还是自建服务”他想看你有没有自己的判断标准能不能说清楚选型背后的代价。记住面试官不怕你有偏好怕的是你给不出理由。第三个是“代码落地能力”对应手写题和算法题。你理论说得再好让你现场写一个防抖、写一个深拷贝、写一个二分查找都写不出来那基本就悬了。所以后面我会专门用一整章讲手写题的备考方法。2. JavaScript 与浏览器原理高频题2.1 事件循环从“背概念”到“手写代码”事件循环大概是我见过出现频率最高、追问也最多的一个问题。基础版本一般是给你一段代码里面混着 setTimeout、Promise、async/await、requestAnimationFrame让你说出输出顺序。我建议不要只背“微任务先于宏任务”这句话而是动笔把整条链路画出来。任务源可以分成三类同步代码、微任务队列、宏任务队列。每执行完一个宏任务都会先把微任务队列清空再进行渲染时机判断然后再取下一个宏任务。这里最关键的是 async/await 的语义await 会暂停当前函数把后续代码当作微任务继续执行。很多人在这里写错顺序。给你一个典型例子console.log(start); setTimeout(() { console.log(timeout1); }, 0); Promise.resolve() .then(() { console.log(promise1); }) .then(() { console.log(promise2); }); console.log(end);输出顺序是 start、end、promise1、promise2、timeout1。原因是同步代码先执行完Promise 的 then 回调进入微任务队列setTimeout 进入宏任务队列。当前宏任务结束时微任务队列必须清空所以 promise1 和 promise2 会先出队等所有微任务都处理完才会执行下一个宏任务 timeout1。再往上一个层级面试官可能会问 Node.js 环境下的事件循环。Node 里多出了 process.nextTick、timer 阶段、poll 阶段、check 阶段而且 process.nextTick 的执行时机比 Promise 还要靠前很容易踩坑。如果你面的岗位偏中后台或服务端渲染这类题出现概率会更高。2.2 闭包、作用域链与 this 指向闭包是必考题追问链条一般是这样的什么是闭包、闭包的原理、闭包的应用场景、闭包会不会造成内存泄漏、如何避免。每一环都要能接住。闭包的本质是“函数能够记住并访问其定义时的词法作用域即使这个函数在外层作用域之外执行”。你可以现场写一个计数器function createCounter() { let count 0; return function () { count; return count; }; } const counter createCounter(); console.log(counter()); // 1 console.log(counter()); // 2这里的 count 被返回的函数引用形成闭包所以它不会被垃圾回收。应用场景包括防抖、节流、柯里化、缓存函数、模块化封装私有变量等。关于内存泄漏要强调一下闭包本身不会造成泄漏问题出在闭包长期持有大对象或者意外持有了已经不需要的 DOM 引用。正确的做法是及时把引用置为 null或者在合适的时机解除事件监听。this 指向也是一个经典坑。四套规则先背清楚默认绑定、隐式绑定、显式绑定call/apply/bind、new 绑定。箭头函数没有自己的 this它会捕获外层上下文的 this。面试时经常用“手写一个 bind”来考察难点在于要考虑 bind 返回的函数如果被 new 调用this 不应该指向绑定对象而是指向新创建的实例。这个细节能写出来的人不多写出来基本就是加分项。作用域链和变量提升同样要熟悉。ES6 之前只有函数作用域和全局作用域ES6 引入了块级作用域let/const 在块内不能重复声明并且存在暂时性死区。不要只背概念要能说出实际工程中的影响比如 for 循环中用 var 和 let 绑定事件的差异就是因为 let 每次迭代都会创建新的块级绑定。2.3 浏览器渲染、跨域与网络基础浏览器从输入 URL 到页面展示的完整过程算是必背主干题。涉及 DNS 解析、TCP 连接、HTTP 请求、服务端响应、HTML 解析、CSS 解析、JS 执行、图层合成、绘制。面试官喜欢在中间插入细节追问比如“script 标签的 defer 和 async 有什么区别”“CSS 会阻塞渲染吗”“重排和重绘怎么优化”。defer 和 async 的区别要答清楚async 是脚本下载完就立即执行不保证执行顺序defer 是等文档解析完成后按顺序执行也就是在 DOMContentLoaded 之前执行。两个都不会阻塞 HTML 解析但执行时机不同。CSS 会阻塞渲染因为渲染树需要 CSSOM 才能构建所以通常建议把 CSS 放在 head 中尽早加载而把非关键的 CSS 异步加载。跨域是前端绕不开的坎。要分清为什么会存在跨域限制然后列出解决方案JSONP、CORS、代理转发、postMessage、document.domain、WebSocket。大厂面试更看重你对 CORS 细节的掌握比如预检请求触发条件、Access-Control-Allow-Origin 如何配置、Cookie 跨域时 withCredentials 怎么设置。HTTP 相关的高频题包括GET 和 POST 的区别、强缓存与协商缓存、HTTP/1.1、HTTP/2 与 HTTP/3 的差异、HTTPS 握手过程。到 2025 年了面试官还会追加“如何减少请求体积”“怎么用 CDN 做静态资源加速”“离线和弱网场景怎么做容灾”这些都要能结合具体实践聊不能只停留在概念层面。3. 框架、微前端与工程化高频题3.1 React 和 Vue 的差异怎么答才不套路面试官问“React 和 Vue 的区别”很多人第一反应是背模板语法、虚拟 DOM、组件通信方式。这样答不会错但很难拿高分。关键是在讲差异的同时把“设计哲学”带出来。React 更偏向函数式数据流单向更新由状态变化驱动本质上更接近“用 JS 描述 UI”。JSX 不是模板它是 JavaScript 表达式所以组合能力和灵活性很强。Vue 更倾向渐进式框架模板语法对后端转前端的同学特别友好响应式系统是自动追踪依赖的开发者不需要手写 memo 也能获得不错的性能。两者都使用虚拟 DOM但更新粒度不同。React 默认从根部往下递归协调需要依靠 memo、useMemo、useCallback 做优化Vue 在组件级别有更细粒度的依赖追踪但它也有边界情况比如通过索引直接修改数组、给对象新增属性响应式系统可能感知不到。这些都是面试官喜欢追问的细节。我还被追问过“如果让你在项目里选型你会怎么选”。这个问题没有标准答案要结合团队技术栈、项目场景、招聘难度和生态来说。比如强交互后台系统React 生态更丰富中小企业追求开发效率Vue 上手快、文档友好。这种开放题答出思考过程比给出结论重要。另外可以提一嘴团队里有没有 React Native 或小程序方面的复用需求这些都会影响选型。3.2 微前端为什么越来越常考从今年各大厂的面经来看微前端已经被列为常见考点。微前端的核心问题是如何让多个子应用独立开发、独立部署又能在主应用里无缝集成。市面上常用的方案有 qiankun、wujie、module federation每个方案的思路都有差异。面试官可能先问为什么会有微前端很多场景是巨石应用没法继续扩展多个团队各自维护自己的模块版本上线互相牵制。微前端就是要解决这种组织协作和技术栈异构问题。如果你只回答“为了拆分代码”说明还没理解它的本质。实现原理方面要能讲清楚路由匹配、应用加载、沙箱隔离、样式隔离、通信机制。qiankun 基于 single-spa 做了 HTML entry 和 JS 沙箱wujie 用 iframe 做渲染层主应用与子应用之间用 Web Worker 做通信代理隔离更彻底同时支持预加载。如果你在项目里不选微前端还应该说出替代方案比如 npm 包方式、Monorepo、普通 iframe。能讲出每个方案的取舍会让面试官觉得你是有体系地思考过这个问题而不是赶时髦。3.3 工程化从构建工具到性能优化前端工程化几乎是每个岗位必聊的话题。Vite 和 Webpack 是出现频率很高的两个词要能说出核心差异Webpack 是一个打包器Vite 开发环境基于原生 ES Module用 esbuild 预构建依赖生产环境用 Rollup 打包。面试喜欢问“Vite 为什么快”核心原因是开发模式按需编译不用把整个应用打包起来只有浏览器请求某个模块时才实时转换依赖预构建又大幅减少了模块请求数量。Webpack 的常考题包括Loader 和 Plugin 的区别、热更新原理、tree-shaking 的原理与限制、代码分割怎么做、CommonJS 和 ESM 的差异。要能现场讲清楚 tree-shaking 依赖 ES Module 的静态分析特性同时知道副作用标记sideEffects和动态导入对结果的影响。性能优化也是大头。首屏加载优化要会讲路由懒加载、图片懒加载、骨架屏、SSR/SSG、预渲染、CDN 加速、HTTP 缓存、资源压缩、减少阻塞脚本、Web Worker 转移计算。要能结合 Lighthouse 的核心指标来定位问题FCP、LCP、CLS、TBT 分别代表什么什么情况下优先优化哪个。比如 LCP 偏高优先看图、字体、首屏接口CLS 波动大优先看布局抖动和没有预留尺寸的图片。按“网络耗时、解析渲染、可交互”三个阶段来组织回答会让你的思路特别清晰。4. 算法与手写代码题4.1 必会手写题清单大厂面试手写题一般分两类一类是前端 JavaScript 手写题一类是数据结构和算法手写题。前者要熟练到能闭眼写出来的程度防抖、节流、深拷贝、数组扁平化、柯里化、bind/call/apply、new、instanceof、Promise.all、Promise.race、事件总线、LazyMan、sleep 等。拿防抖来说很多人的实现只考虑了定时器却忘了 this 指向和参数传递function debounce(fn, delay 300) { let timer null; return function (...args) { if (timer) clearTimeout(timer); timer setTimeout(() { fn.apply(this, args); timer null; }, delay); }; }这里的 apply 就是关键细节。如果漏掉 this 指向和参数面试官大概率会追问“如果调用方用了对象方法this 会不会丢”你提前写好就能直接封住这个追问。算法手写题常见的有数组去重、字符串去重、反转链表、环形链表、用栈实现队列、二叉树的层序遍历、前中后序遍历递归和迭代都要会、合并两个有序数组、最长不重复子串、两数之和、三数之和、全排列、二分查找、爬楼梯和零钱兑换等动态规划入门题。写题时有几个拿分技巧。第一先和面试官确认输入输出约束比如数组是否有序、是否包含负数、字符串长度范围避免边界漏判。第二先写暴力解再说优化思路这样即使优化没写出来面试官也知道你有分析能力。第三用注释解释关键步骤让面试官跟上你的思路。第四变量命名要清晰不要写 a、b、c 这种让人看不懂的名字。4.2 前端算法题的备考思路很多人觉得大厂前端算法题很难其实考点深度远没有后端高。重点集中在数组、字符串、链表、二叉树、栈、队列、哈希表偶尔出现贪心和动态规划的基础题。搜索和排序也很高频尤其是快排、归并排序和二分查找。我建议用固定节奏刷题先按类型刷比如连刷十天二叉树再连刷十天动态规划。每道题先独立思考二十分钟再看题解然后自己重新写一遍隔天再写一遍形成长期记忆。同时把复杂度分析练成肌肉记忆每次刷完题都主动写一下时间复杂度和空间复杂度面试时才能条件反射地说出来。要注意的是面试里的算法题不是死刷数量就能解决的。我见过不少刷了几百题的同学遇到变体题还是卡住。原因在于只记题解没有总结规律。比如看到“求满足条件的最长区间”应该能联想到“滑动窗口”或“哈希表记录位置”这两种套路看到“链表成环”应该能条件反射地想到“快慢指针”。平时刷题过程中每道题都顺手标注考的是哪个套路慢慢就会形成自己的解题框架。5. 项目深挖与开放题5.1 简历里的项目怎么讲才能扛住追问项目深挖是百度这类大厂面试的重头戏也是很多人的短板。最常见的问题是你简历写了“优化首屏性能白屏时间降低 50%”面试官会立刻追问怎么测的用的是什么指标基线是多少做了哪些动作为什么是这些动作而不是别的降了 50% 之后有没有副作用如果你答不出关键细节这段经历反而会变成减分项。所以简历上写的每一个数字都必须能解释清楚。我建议用 STAR 法则准备项目故事背景、目标、行动、结果。举个例子背景是活动页首屏在低端机慢目标是 LCP 降到 2.5 秒以内行动包括路由懒加载、图片 WebP 化、接口并发优化、骨架屏占位结果是线上 LCP 从 4.2 秒降到 2.1 秒P75 数据提升 45%。同时要准备一个“最大的坑”面试官极大概率会问“项目中遇到最大的困难是什么”。别答“没有”也别答很虚的“团队沟通问题”最好是技术困难能体现你的排查思路。另外不要只讲自己写的页面要讲底层逻辑。比如你做过组件库就要准备好回答“组件库如何做按需加载”“如何设计 API”“如何避免多版本冲突”。项目本身大小不重要重要的是你在这个项目里有没有深度思考。5.2 开放题如何回答“前端还有前途吗”2025 年的面试问答里开放题越来越多。面试官可能问“你怎么看待 AI 辅助编码对前端的影响”“如果让你设计一个前端监控平台你会怎么做”“你如何看待低代码平台”。这些问题没有一个标准答案考察的是你的技术视野和思维深度。回答这类题重点是展现思考框架而不是给出唯一结论。我习惯按三层来拆先讲现象再讲对现有工作的改变最后讲机会在哪里。比如聊 AI 对前端的影响可以先说 AI 编程助手正在改变重复性编码的工作方式写业务组件的门槛在降低然后说门槛降低反而让架构设计、性能优化、复杂业务建模这些能力变得更值钱最后落到前端可以主动拥抱 AI把大模型能力做到产品里比如智能表单、RAG 对话、内容生成、自动化测试等。能结合一个具体实践案例来讲比泛泛而谈要加分得多。如果问“让你设计一个前端监控平台”就从监控数据采集、上报策略、数据处理、报警配置、可视化报表这几层展开再强调一下采样率、错误堆栈解析、sourcemap 还原这些关键点。面试官想看到的是你能不能在短时间内搭建一个结构完整的方案而不是答案本身有多完美。6. 常见问题与复盘心得6.1 面试时容易踩的坑第一个坑是“只背答案不追问自己为什么”。面试官很擅长连环追问你背了闭包的定义却答不出闭包在框架源码里的典型场景或者不会写一个基于闭包的防抖就会被扣分。正确的复习方式是每背一个知识点都问自己三个问题它在什么场景下出现它解决了什么问题如果不用它会怎样第二个坑是“项目讲得太浅”。答项目时只说“我做了 XX 模块”没有讲清方案选型、几个方案的对比、异常处理、监控埋点、上线后的数据效果。这样的回答内容量太低面试官没法判断你的真实水平只能加大追问力度。第三个坑是“手写题不检查边界”。比如写防抖的时候没有考虑 this写深拷贝的时候没有处理循环引用和 Symbol写 Promise 系列的时候没有处理错误和 then 链。面试评分是按点给分的边界处理是明显的得分点不能丢。还有一个很实用的建议面试前一定要对着镜子或者录音练两遍自我介绍和项目介绍。很多人在脑子里想得很清楚一旦说出口逻辑混乱、语速过快。录下来听一遍你会发现自己平时注意不到的口头禅和停顿提前改掉面试时的表达会提升一个档次。6.2 我整理的备考节奏如果只有一个月的准备时间我会这样安排第 1 周集中整理高频 JS 基础题、浏览器原理、网络基础每天手写 5 道基础题比如防抖、节流、深拷贝、Promise.all、bind。第 2 周主攻框架和工程化把 React/Vue 核心原理、构建工具、性能优化、微前端、组件库设计这几个大话题系统过一遍每类整理一份十问十答。第 3 周刷算法题。按类型刷重点梳理二叉树层序、DFS、BFS、动态规划入门题。白天刷题晚上整理错题本每道错题都写上错因和正确思路。第 4 周项目复盘加模拟面试。把简历上的项目按 STAR 法则写成逐字稿再找朋友或自己模拟两轮完整面试掐时间回答重点练临场反应和语言组织。在整个备考过程中最重要的是建立自己的“知识树”而不是零散地背题。我习惯把面试知识按六个层次拆开网络层、渲染层、JS 执行层、框架层、工程层、产品层。面试时不管问题从哪里切入都能先定位到对应层级再逐层展开细节。这套方法帮我快速识别自己哪一层最薄弱也让我的回答更有体系感。面试不是背题大赛真正拉开差距的是你对问题背后体系的理解深度。最后再分享一个我自己的小技巧每次面试结束后我都会在半小时内把被问到的问题按“答得好的、勉强答出来的、完全没答上的”三类记录下来。尤其是没答上的题当晚就要去查资料补上因为面试官追问的角度往往代表了这个岗位最看重的能力。坚持三轮面试下来你的知识盲区会变得非常清晰后续复习自然有方向。 
长河君 · 2026/9/2 15:37:41 · 阅读 1.2k 2025百度前端面试核心考点全解析与备考策略
2025 年准备百度前端岗位的面试要复习的东西是真的多。我在过去几个月里把近两年百度前端相关的面经、公开题库和身边朋友的真实反馈翻了个遍自己也按大厂节奏模拟了好几轮最终整理出一份围绕高频题型的备考清单。这篇文章不是让你生背题目而是把每个高频考点背后的思考逻辑、常见追问方式以及那些只有实战过才会知道的坑一条条拉出来拆开讲。不管你是准备校招、社招还是单纯想做一次系统性复盘这份内容都值得你花点时间慢慢看。1. 百度前端面试到底在考什么1.1 面试轮次与整体节奏百度的前端面试流程通常比较稳定简历筛选之后先来一轮电话沟通或者在线笔试然后进入技术一面、二面走到最后一般会有主管面或交叉面最后是 HR 面。笔试环节多数是算法题加前端基础题有些部门会直接发在线编程链接题量不大但覆盖面很广时间卡得也比较紧。电话面很多时候是技术初筛主要聊项目、聊基础比如随手问你对 React 和 Vue 的理解、事件循环、项目难点。一面开始进入正题面试官会从 JavaScript 基础、浏览器原理、框架原理、网络、工程化这几个方向交叉提问。二面则更偏项目深挖、设计思路、疑难问题排查有时还会抛出一个开放场景让你现场给方案。到了主管面重点会转向技术视野、团队协作能力和解决问题的思路。不同部门会有差异但整体逻辑差不多。1.2 大厂面试官的考核逻辑是什么表面上看面试是围绕知识点提问实际上面试官在验证三个底层能力。第一个是“从现象到原理”的还原能力。很多题目都会从一个线上问题切入比如“页面白屏你怎么排查”“首屏加载慢你会怎么做”。这时候真正想听的不是你背过的答案而是你能不能在心里画出浏览器从输入 URL 到页面渲染的完整链路然后逐层定位问题。能把白屏拆成网络没回来、资源加载失败、JS 报错、渲染阻塞等几个可能方向再给出对应排查工具这种回答才是合格的。第二个是“方案的权衡能力”。前端工程里几乎没有绝对正确的唯一解面试官故意抛出一个两难问题比如“组件库要不要统一”“微前端选 qiankun 还是 wujie”“图片用 CDN 还是自建服务”他想看你有没有自己的判断标准能不能说清楚选型背后的代价。记住面试官不怕你有偏好怕的是你给不出理由。第三个是“代码落地能力”对应手写题和算法题。你理论说得再好让你现场写一个防抖、写一个深拷贝、写一个二分查找都写不出来那基本就悬了。所以后面我会专门用一整章讲手写题的备考方法。2. JavaScript 与浏览器原理高频题2.1 事件循环从“背概念”到“手写代码”事件循环大概是我见过出现频率最高、追问也最多的一个问题。基础版本一般是给你一段代码里面混着 setTimeout、Promise、async/await、requestAnimationFrame让你说出输出顺序。我建议不要只背“微任务先于宏任务”这句话而是动笔把整条链路画出来。任务源可以分成三类同步代码、微任务队列、宏任务队列。每执行完一个宏任务都会先把微任务队列清空再进行渲染时机判断然后再取下一个宏任务。这里最关键的是 async/await 的语义await 会暂停当前函数把后续代码当作微任务继续执行。很多人在这里写错顺序。给你一个典型例子console.log(start); setTimeout(() { console.log(timeout1); }, 0); Promise.resolve() .then(() { console.log(promise1); }) .then(() { console.log(promise2); }); console.log(end);输出顺序是 start、end、promise1、promise2、timeout1。原因是同步代码先执行完Promise 的 then 回调进入微任务队列setTimeout 进入宏任务队列。当前宏任务结束时微任务队列必须清空所以 promise1 和 promise2 会先出队等所有微任务都处理完才会执行下一个宏任务 timeout1。再往上一个层级面试官可能会问 Node.js 环境下的事件循环。Node 里多出了 process.nextTick、timer 阶段、poll 阶段、check 阶段而且 process.nextTick 的执行时机比 Promise 还要靠前很容易踩坑。如果你面的岗位偏中后台或服务端渲染这类题出现概率会更高。2.2 闭包、作用域链与 this 指向闭包是必考题追问链条一般是这样的什么是闭包、闭包的原理、闭包的应用场景、闭包会不会造成内存泄漏、如何避免。每一环都要能接住。闭包的本质是“函数能够记住并访问其定义时的词法作用域即使这个函数在外层作用域之外执行”。你可以现场写一个计数器function createCounter() { let count 0; return function () { count; return count; }; } const counter createCounter(); console.log(counter()); // 1 console.log(counter()); // 2这里的 count 被返回的函数引用形成闭包所以它不会被垃圾回收。应用场景包括防抖、节流、柯里化、缓存函数、模块化封装私有变量等。关于内存泄漏要强调一下闭包本身不会造成泄漏问题出在闭包长期持有大对象或者意外持有了已经不需要的 DOM 引用。正确的做法是及时把引用置为 null或者在合适的时机解除事件监听。this 指向也是一个经典坑。四套规则先背清楚默认绑定、隐式绑定、显式绑定call/apply/bind、new 绑定。箭头函数没有自己的 this它会捕获外层上下文的 this。面试时经常用“手写一个 bind”来考察难点在于要考虑 bind 返回的函数如果被 new 调用this 不应该指向绑定对象而是指向新创建的实例。这个细节能写出来的人不多写出来基本就是加分项。作用域链和变量提升同样要熟悉。ES6 之前只有函数作用域和全局作用域ES6 引入了块级作用域let/const 在块内不能重复声明并且存在暂时性死区。不要只背概念要能说出实际工程中的影响比如 for 循环中用 var 和 let 绑定事件的差异就是因为 let 每次迭代都会创建新的块级绑定。2.3 浏览器渲染、跨域与网络基础浏览器从输入 URL 到页面展示的完整过程算是必背主干题。涉及 DNS 解析、TCP 连接、HTTP 请求、服务端响应、HTML 解析、CSS 解析、JS 执行、图层合成、绘制。面试官喜欢在中间插入细节追问比如“script 标签的 defer 和 async 有什么区别”“CSS 会阻塞渲染吗”“重排和重绘怎么优化”。defer 和 async 的区别要答清楚async 是脚本下载完就立即执行不保证执行顺序defer 是等文档解析完成后按顺序执行也就是在 DOMContentLoaded 之前执行。两个都不会阻塞 HTML 解析但执行时机不同。CSS 会阻塞渲染因为渲染树需要 CSSOM 才能构建所以通常建议把 CSS 放在 head 中尽早加载而把非关键的 CSS 异步加载。跨域是前端绕不开的坎。要分清为什么会存在跨域限制然后列出解决方案JSONP、CORS、代理转发、postMessage、document.domain、WebSocket。大厂面试更看重你对 CORS 细节的掌握比如预检请求触发条件、Access-Control-Allow-Origin 如何配置、Cookie 跨域时 withCredentials 怎么设置。HTTP 相关的高频题包括GET 和 POST 的区别、强缓存与协商缓存、HTTP/1.1、HTTP/2 与 HTTP/3 的差异、HTTPS 握手过程。到 2025 年了面试官还会追加“如何减少请求体积”“怎么用 CDN 做静态资源加速”“离线和弱网场景怎么做容灾”这些都要能结合具体实践聊不能只停留在概念层面。3. 框架、微前端与工程化高频题3.1 React 和 Vue 的差异怎么答才不套路面试官问“React 和 Vue 的区别”很多人第一反应是背模板语法、虚拟 DOM、组件通信方式。这样答不会错但很难拿高分。关键是在讲差异的同时把“设计哲学”带出来。React 更偏向函数式数据流单向更新由状态变化驱动本质上更接近“用 JS 描述 UI”。JSX 不是模板它是 JavaScript 表达式所以组合能力和灵活性很强。Vue 更倾向渐进式框架模板语法对后端转前端的同学特别友好响应式系统是自动追踪依赖的开发者不需要手写 memo 也能获得不错的性能。两者都使用虚拟 DOM但更新粒度不同。React 默认从根部往下递归协调需要依靠 memo、useMemo、useCallback 做优化Vue 在组件级别有更细粒度的依赖追踪但它也有边界情况比如通过索引直接修改数组、给对象新增属性响应式系统可能感知不到。这些都是面试官喜欢追问的细节。我还被追问过“如果让你在项目里选型你会怎么选”。这个问题没有标准答案要结合团队技术栈、项目场景、招聘难度和生态来说。比如强交互后台系统React 生态更丰富中小企业追求开发效率Vue 上手快、文档友好。这种开放题答出思考过程比给出结论重要。另外可以提一嘴团队里有没有 React Native 或小程序方面的复用需求这些都会影响选型。3.2 微前端为什么越来越常考从今年各大厂的面经来看微前端已经被列为常见考点。微前端的核心问题是如何让多个子应用独立开发、独立部署又能在主应用里无缝集成。市面上常用的方案有 qiankun、wujie、module federation每个方案的思路都有差异。面试官可能先问为什么会有微前端很多场景是巨石应用没法继续扩展多个团队各自维护自己的模块版本上线互相牵制。微前端就是要解决这种组织协作和技术栈异构问题。如果你只回答“为了拆分代码”说明还没理解它的本质。实现原理方面要能讲清楚路由匹配、应用加载、沙箱隔离、样式隔离、通信机制。qiankun 基于 single-spa 做了 HTML entry 和 JS 沙箱wujie 用 iframe 做渲染层主应用与子应用之间用 Web Worker 做通信代理隔离更彻底同时支持预加载。如果你在项目里不选微前端还应该说出替代方案比如 npm 包方式、Monorepo、普通 iframe。能讲出每个方案的取舍会让面试官觉得你是有体系地思考过这个问题而不是赶时髦。3.3 工程化从构建工具到性能优化前端工程化几乎是每个岗位必聊的话题。Vite 和 Webpack 是出现频率很高的两个词要能说出核心差异Webpack 是一个打包器Vite 开发环境基于原生 ES Module用 esbuild 预构建依赖生产环境用 Rollup 打包。面试喜欢问“Vite 为什么快”核心原因是开发模式按需编译不用把整个应用打包起来只有浏览器请求某个模块时才实时转换依赖预构建又大幅减少了模块请求数量。Webpack 的常考题包括Loader 和 Plugin 的区别、热更新原理、tree-shaking 的原理与限制、代码分割怎么做、CommonJS 和 ESM 的差异。要能现场讲清楚 tree-shaking 依赖 ES Module 的静态分析特性同时知道副作用标记sideEffects和动态导入对结果的影响。性能优化也是大头。首屏加载优化要会讲路由懒加载、图片懒加载、骨架屏、SSR/SSG、预渲染、CDN 加速、HTTP 缓存、资源压缩、减少阻塞脚本、Web Worker 转移计算。要能结合 Lighthouse 的核心指标来定位问题FCP、LCP、CLS、TBT 分别代表什么什么情况下优先优化哪个。比如 LCP 偏高优先看图、字体、首屏接口CLS 波动大优先看布局抖动和没有预留尺寸的图片。按“网络耗时、解析渲染、可交互”三个阶段来组织回答会让你的思路特别清晰。4. 算法与手写代码题4.1 必会手写题清单大厂面试手写题一般分两类一类是前端 JavaScript 手写题一类是数据结构和算法手写题。前者要熟练到能闭眼写出来的程度防抖、节流、深拷贝、数组扁平化、柯里化、bind/call/apply、new、instanceof、Promise.all、Promise.race、事件总线、LazyMan、sleep 等。拿防抖来说很多人的实现只考虑了定时器却忘了 this 指向和参数传递function debounce(fn, delay 300) { let timer null; return function (...args) { if (timer) clearTimeout(timer); timer setTimeout(() { fn.apply(this, args); timer null; }, delay); }; }这里的 apply 就是关键细节。如果漏掉 this 指向和参数面试官大概率会追问“如果调用方用了对象方法this 会不会丢”你提前写好就能直接封住这个追问。算法手写题常见的有数组去重、字符串去重、反转链表、环形链表、用栈实现队列、二叉树的层序遍历、前中后序遍历递归和迭代都要会、合并两个有序数组、最长不重复子串、两数之和、三数之和、全排列、二分查找、爬楼梯和零钱兑换等动态规划入门题。写题时有几个拿分技巧。第一先和面试官确认输入输出约束比如数组是否有序、是否包含负数、字符串长度范围避免边界漏判。第二先写暴力解再说优化思路这样即使优化没写出来面试官也知道你有分析能力。第三用注释解释关键步骤让面试官跟上你的思路。第四变量命名要清晰不要写 a、b、c 这种让人看不懂的名字。4.2 前端算法题的备考思路很多人觉得大厂前端算法题很难其实考点深度远没有后端高。重点集中在数组、字符串、链表、二叉树、栈、队列、哈希表偶尔出现贪心和动态规划的基础题。搜索和排序也很高频尤其是快排、归并排序和二分查找。我建议用固定节奏刷题先按类型刷比如连刷十天二叉树再连刷十天动态规划。每道题先独立思考二十分钟再看题解然后自己重新写一遍隔天再写一遍形成长期记忆。同时把复杂度分析练成肌肉记忆每次刷完题都主动写一下时间复杂度和空间复杂度面试时才能条件反射地说出来。要注意的是面试里的算法题不是死刷数量就能解决的。我见过不少刷了几百题的同学遇到变体题还是卡住。原因在于只记题解没有总结规律。比如看到“求满足条件的最长区间”应该能联想到“滑动窗口”或“哈希表记录位置”这两种套路看到“链表成环”应该能条件反射地想到“快慢指针”。平时刷题过程中每道题都顺手标注考的是哪个套路慢慢就会形成自己的解题框架。5. 项目深挖与开放题5.1 简历里的项目怎么讲才能扛住追问项目深挖是百度这类大厂面试的重头戏也是很多人的短板。最常见的问题是你简历写了“优化首屏性能白屏时间降低 50%”面试官会立刻追问怎么测的用的是什么指标基线是多少做了哪些动作为什么是这些动作而不是别的降了 50% 之后有没有副作用如果你答不出关键细节这段经历反而会变成减分项。所以简历上写的每一个数字都必须能解释清楚。我建议用 STAR 法则准备项目故事背景、目标、行动、结果。举个例子背景是活动页首屏在低端机慢目标是 LCP 降到 2.5 秒以内行动包括路由懒加载、图片 WebP 化、接口并发优化、骨架屏占位结果是线上 LCP 从 4.2 秒降到 2.1 秒P75 数据提升 45%。同时要准备一个“最大的坑”面试官极大概率会问“项目中遇到最大的困难是什么”。别答“没有”也别答很虚的“团队沟通问题”最好是技术困难能体现你的排查思路。另外不要只讲自己写的页面要讲底层逻辑。比如你做过组件库就要准备好回答“组件库如何做按需加载”“如何设计 API”“如何避免多版本冲突”。项目本身大小不重要重要的是你在这个项目里有没有深度思考。5.2 开放题如何回答“前端还有前途吗”2025 年的面试问答里开放题越来越多。面试官可能问“你怎么看待 AI 辅助编码对前端的影响”“如果让你设计一个前端监控平台你会怎么做”“你如何看待低代码平台”。这些问题没有一个标准答案考察的是你的技术视野和思维深度。回答这类题重点是展现思考框架而不是给出唯一结论。我习惯按三层来拆先讲现象再讲对现有工作的改变最后讲机会在哪里。比如聊 AI 对前端的影响可以先说 AI 编程助手正在改变重复性编码的工作方式写业务组件的门槛在降低然后说门槛降低反而让架构设计、性能优化、复杂业务建模这些能力变得更值钱最后落到前端可以主动拥抱 AI把大模型能力做到产品里比如智能表单、RAG 对话、内容生成、自动化测试等。能结合一个具体实践案例来讲比泛泛而谈要加分得多。如果问“让你设计一个前端监控平台”就从监控数据采集、上报策略、数据处理、报警配置、可视化报表这几层展开再强调一下采样率、错误堆栈解析、sourcemap 还原这些关键点。面试官想看到的是你能不能在短时间内搭建一个结构完整的方案而不是答案本身有多完美。6. 常见问题与复盘心得6.1 面试时容易踩的坑第一个坑是“只背答案不追问自己为什么”。面试官很擅长连环追问你背了闭包的定义却答不出闭包在框架源码里的典型场景或者不会写一个基于闭包的防抖就会被扣分。正确的复习方式是每背一个知识点都问自己三个问题它在什么场景下出现它解决了什么问题如果不用它会怎样第二个坑是“项目讲得太浅”。答项目时只说“我做了 XX 模块”没有讲清方案选型、几个方案的对比、异常处理、监控埋点、上线后的数据效果。这样的回答内容量太低面试官没法判断你的真实水平只能加大追问力度。第三个坑是“手写题不检查边界”。比如写防抖的时候没有考虑 this写深拷贝的时候没有处理循环引用和 Symbol写 Promise 系列的时候没有处理错误和 then 链。面试评分是按点给分的边界处理是明显的得分点不能丢。还有一个很实用的建议面试前一定要对着镜子或者录音练两遍自我介绍和项目介绍。很多人在脑子里想得很清楚一旦说出口逻辑混乱、语速过快。录下来听一遍你会发现自己平时注意不到的口头禅和停顿提前改掉面试时的表达会提升一个档次。6.2 我整理的备考节奏如果只有一个月的准备时间我会这样安排第 1 周集中整理高频 JS 基础题、浏览器原理、网络基础每天手写 5 道基础题比如防抖、节流、深拷贝、Promise.all、bind。第 2 周主攻框架和工程化把 React/Vue 核心原理、构建工具、性能优化、微前端、组件库设计这几个大话题系统过一遍每类整理一份十问十答。第 3 周刷算法题。按类型刷重点梳理二叉树层序、DFS、BFS、动态规划入门题。白天刷题晚上整理错题本每道错题都写上错因和正确思路。第 4 周项目复盘加模拟面试。把简历上的项目按 STAR 法则写成逐字稿再找朋友或自己模拟两轮完整面试掐时间回答重点练临场反应和语言组织。在整个备考过程中最重要的是建立自己的“知识树”而不是零散地背题。我习惯把面试知识按六个层次拆开网络层、渲染层、JS 执行层、框架层、工程层、产品层。面试时不管问题从哪里切入都能先定位到对应层级再逐层展开细节。这套方法帮我快速识别自己哪一层最薄弱也让我的回答更有体系感。面试不是背题大赛真正拉开差距的是你对问题背后体系的理解深度。最后再分享一个我自己的小技巧每次面试结束后我都会在半小时内把被问到的问题按“答得好的、勉强答出来的、完全没答上的”三类记录下来。尤其是没答上的题当晚就要去查资料补上因为面试官追问的角度往往代表了这个岗位最看重的能力。坚持三轮面试下来你的知识盲区会变得非常清晰后续复习自然有方向。