百度前端秋招笔试复盘：从JS原理到算法题型的备考指南

每年一到七八月份，大厂秋招就陆续启动了。我去年参加了百度的前端岗秋招笔试，整体感受是：难度不算夸张，但考察的覆盖面非常广，从网络协议到浏览器原理，从手写Promise到算法题，几乎每个前端基础板块都会被点到。如果你今年准备投百度前端岗，这篇复盘能帮你把笔试的考察方向、题型套路和备考重点一次性捋清楚。

先说结论：百度前端笔试的基调是“重视基础、偏向原理、算法有区分度”。它不像字节那样爱考工程化和场景设计，也不像腾讯那么偏重计算机基础，百度更像是“前端基础和算法能力都要，但都不求最顶尖”。选择题里藏着大量细节坑，编程题难度中等偏上，能拉开差距的往往是边界条件的处理和对复杂度的优化意识。

1. 笔试整体风格与考纲拆解

笔试总共120分钟，题量在45到50题之间，题型分布大概是：单选题25题左右，多选题10题左右，编程题2到3题。选择题覆盖计算机基础、网络、JavaScript、浏览器原理、前端框架，编程题则以LeetCode中等题为主。

我先说我印象最深的几点。第一，多选题真的是用来拉分的，因为少选、多选、选错都不给分，很多选项描述得极像“正确答案”，比如关于事件循环的某个说法，措辞改了一个字就从对变错。第二，编程题不是传统的ACM风格，而是偏向“实现功能、处理边界”的工程向题目，输入输出不会出特别刁钻的格式，但要求你考虑空值、异常输入、大数据量性能。

从考纲权重来看，我把历年高频考点整理成了一个表，方便你对照自身薄弱项做准备：

这个分数分布是我个人的经验值，每年的具体比例会波动，但前端基础和算法这两块是永远的主旋律。我在准备时最明显的感觉是：背框架API根本不够，百度考的是“为什么这个框架要这样设计”。

1.1 为什么百度笔试爱考基础原理

百度前端面试向来有“手写源码”的传统，笔试自然也会延续这个风格。笔试没法现场看你写代码的过程，所以选择题就会变成“考原理”的重灾区。比如它会给你一段代码，问你输出顺序是什么；给你一个对象和一段操作，问引用类型的值变化；给你一个HTTP请求的时序图，问缓存命中的是哪个阶段。

我当时复习的切入点就是：不背结论，自己去推演一遍。把“闭包是什么”换成“闭包在这段代码里如何导致变量被意外保留”，把“transform为什么比top性能好”换成“浏览器在合成阶段做了什么”。这样面对选择题的变化题才不会慌。

1.2 和字节、腾讯笔试的横向对比

每年秋招大家都会在几个大厂之间海投，所以我顺手对比一下三家的笔试风格，帮你制定差异化的复习策略。

如果时间紧，你自己要先定目标：只冲百度就主攻基础细节；同时准备多家，就把算法的优先级提上来。因为算法是全国大厂笔试的通用的门槛，先把力扣常考题型刷熟，再去补各家的特色考题，效率最高。

2. 计算机基础与网络知识：笔试第一大送分池

很多人觉得前端不用太懂网络，笔试里偏偏考得很多。百度的选择里，TCP、HTTP、DNS、浏览器缓存几乎每年都出现。这些内容其实不难，属于“只要你系统复习过，就能拿分”的板块，但问题恰恰在于大家平时写业务根本接触不到这些细节。

2.1 TCP握手和缓存策略的经典考法

关于TCP三次握手和四次挥手，选择题常见的挖坑方式有两种：一是问你握手阶段的状态变化，二是问四次挥手时TIME_WAIT出现在哪一端、作用是什么。

比如真题里这样出过：“客户端发送FIN后，首先进入什么状态？”答案是FIN_WAIT_1，很多人会误选成TIME_WAIT。这个知识点本身不难，只要把状态迁移图完整过一遍就能记住。TIME_WAIT是在客户端收到服务器最终ACK之后才进入的，目的是让迟到的报文段有时间被丢弃，避免影响新连接。

HTTP缓存这块，百度喜欢结合具体场景出题。比如：第一次请求返回了Cache-Control: max-age=3600，问10分钟后再发请求，会走强缓存还是协商缓存？或者给你两个响应头，让你判断哪个优先级更高。实际上相关优先级是：Cache-Control的no-store最高，然后是no-cache、max-age，最后才是Expires。如果还带上了ETag，那么协商缓存阶段的判断顺序是：先看Cache-Control是否过期，过期后再带If-None-Match请求头，服务器比对ETag决定返回200还是304。

2.2 操作系统的进程线程与内存考点

前端岗考操作系统，不会出得太深，但进程线程的区别、死锁产生的四个必要条件、虚拟内存和分页这些基础题，命中率很高。比如它会给你四个场景，让你判断哪个不会导致死锁；“互斥条件、请求保持、不可剥夺、循环等待”这四个条件缺一不可，少一个都不是死锁。

这里我推荐用一句话串起来记忆：死锁就是“每个人都占着碗里的、盯着锅里的，又没人愿意放筷子”。这样遇到多选题问必要条件，你只需要检查四个选项是否都具备即可。

有意思的是，百度笔试还考过一次“栈和堆的区别”，乍一看以为是数据结构的题，实际上它问的是内存分区。栈区由编译器自动分配释放，存放函数参数、局部变量；堆区由程序员分配释放，比如new出来的对象。前端语言虽然不会让你手动管理内存，但理解这个模型，对面试中聊V8内存机制、垃圾回收也有帮助。

3. JavaScript核心：笔试的选择题重灾区

如果说计算机基础是“背了就给分”，那么JavaScript选择题就是“看了选项觉得自己会，对答案发现自己错了一片”的板块。主要原因在于JS的隐式转换、异步机制、作用域规则细节太多，每个选项都能编出一个判断点。

3.1 事件循环与宏任务/微任务的必考套路

几乎每年必考一道“代码输出顺序”题。初始代码大概是：console.log('script start')、setTimeout、Promise.resolve().then、async/await、console.log('script end')，让你输出执行顺序。这个题能把很多人绕晕的地方在于async函数内部的await后面那段代码，其实相当于被放进了微任务队列。

当时我踩过的一个坑是：await后面的代码不一定是在当前Promise微任务里执行。拿这段代码举例：

async function test() { console.log('async start'); await Promise.resolve(); console.log('async end'); } console.log('sync'); test(); setTimeout(() => console.log('timeout'), 0);

输出顺序是：sync、async start、async end、timeout。注意await Promise.resolve()右边表达式先执行，Promise.resolve()已经resolved，所以await会把后续代码作为微任务排队；当同步代码执行完，微任务队列里“async end”先跑，再跑宏任务timeout。如果await后面跟的不是Promise，而是一个普通值，底层会把它包装成Promise.resolve(value)，执行逻辑不变。

这个知识点真的值得多刷几道变种题。比如把await语句放在for循环里，await是顺序执行的，不是并发。此时如果你想让多个异步请求并行，就需要用Promise.all，这也是面试官很喜欢追问的点。

3.2 闭包、this指向与原型链的选择题陷阱

百度的选择题特别喜欢把闭包和var/let声明混在一起考。有一段经典代码：

for (var i = 0; i < 5; i++) { setTimeout(() => console.log(i), 1000); }

这段代码的坑在于var声明的i是函数作用域，循环中创建的五个箭头函数共享同一个i，等定时器触发时i已经变成5，所以输出五个5。把var改成let后，每次循环会创建一个块级绑定，所以输出0、1、2、3、4。原理上就是闭包捕获了每次迭代的独立变量，而不是最终的变量状态。

this指向其实比闭包稍微好背一点，因为规律是固定的：普通函数的this取决于调用方式，箭头函数的this取决于定义位置。但笔试题目往往不是考这个结论，而是让在代码中间填入一段调用，使得this指向某个对象。我当时总结的方法是做题先画出“调用现场”：foo()挂在哪里、以什么形式被调用。是obj.foo()那this就是obj，是独立调用那严格模式下就是undefined，非严格模式是全局对象，是new foo()那this就是新创建的对象。

原型链题目则最爱考instanceof的底层逻辑。instanceof并不是看构造函数的身份，而是检查构造函数的prototype对象是否在实例的原型链上。所以有个经典反直觉例子：f instanceof Foo并不等于f是Foo生成的，如果Foo.prototype被替换成另一个对象，老实例和老构造函数之间就没有关系了。我笔试时遇到的是给几个对象关系，问哪个表达式返回true，这种题只要把原型链画出来，基本秒解。

3.3 手写Promise与防抖节流的实战思路

百度笔试的选择题里偶尔会出现“哪段代码正确实现了XXX”，这时候手写代码的思考方式就派上用场了。我记得有一题是要求选出正确的深拷贝实现，选项有的是浅拷贝、有的是JSON序列化方式、还有的是递归但没处理循环引用。如果平时只是背代码不自己写过，很难迅速判断每个选项的缺陷。

我在准备阶段养成了一个习惯：重要的手写题一定要自己默写，而不是复制粘贴。防抖、节流、深拷贝、Promise.all、Promise.race、new的实现、call/apply/bind的实现，这八个是必练的。默写的好处是能记住关键细节，比如bind返回的函数如果被new调用，this应该被忽略；深拷贝需要用一个WeakMap来记录已经拷贝过的对象，避免循环引用导致栈溢出。

这里给出一个带循环引用处理的深拷贝模板，笔试选择里经常考它的优化点：

function deepClone(target, map = new WeakMap()) { if (typeof target !== 'object' || target === null) return target; if (map.has(target)) return map.get(target); const clone = Array.isArray(target) ? [] : {}; map.set(target, clone); for (const key of Reflect.ownKeys(target)) { clone[key] = deepClone(target[key], map); } return clone; }

这道题里的关键点有两个：一是WeakMap避免了循环引用和内存泄漏，二是用Reflect.ownKeys可以遍历到Symbol类型的键。很多代码题表面上是在考函数实现，实际上是在考你对语言底层特性的理解，这一点在百度笔试体现得特别明显。

4. 浏览器原理与网络请求：前端面试高频场景

浏览器原理这块，百度考察的集中度很高，基本上就是三件事：从输入URL到页面渲染发生了什么、浏览器的缓存机制、回流重绘的触发条件与优化。第三个内容还经常和性能优化选择题绑定，后面我会一起说。

4.1 从URL输入到页面渲染的全过程

这大概是前端面试最“八股”的题，但笔试和面试考法不一样。笔试往往把其中某一步拆开，变成判断题，或者让你排序。步骤大体是：DNS解析、建立TCP连接、发送HTTP请求、服务器响应、浏览器解析HTML构建DOM树、解析CSS构建CSSOM、合并渲染树、布局、绘制、合成。

我见过一道真题，选项里混入了“浏览器先解析JavaScript再解析CSS”的错误说法。事实上，浏览器解析过程是分主线程和预加载扫描的，CSS不会阻塞DOM解析，但会阻塞渲染，因为渲染树需要CSSOM。而带defer的script标签会延迟到整个文档解析完成后再执行，async则是一旦下载完成就立即执行，有可能Javascript先执行而阻塞DOM构建。

遇到这种排序题，我建议关键记两点：渲染树只有可见元素，display:none的节点不会出现在渲染树中；visibility:hidden虽然不可见，但仍会占据布局空间，所以它仍然在渲染树中，只是不绘制。这个区别经常被出成判断题。

4.2 前端缓存、CDN与强缓存/协商缓存的区别

缓存几乎属于必考题。强缓存相关的响应头是Cache-Control，而不是Expires。Cache-Control的max-age优先级高于Expires，后者是HTTP/1.0的产物，经常被拿来做干扰项。协商缓存相关的头是ETag/If-None-Match和Last-Modified/If-Modified-Since，其中ETag优先级更高，因为HTTP/1.1中ETag比Last-Modified更准确。

面试和笔试常考的一个场景题是：“为什么说ETag比Last-Modified更可靠？”因为Last-Modified只能精确到秒，同一秒内文件修改了但时间没变，客户端就会拿到旧缓存；ETag则是服务端根据文件内容计算的唯一标识，内容变了标识就变，精确度更高。我在笔试中就遇到了这个考点，只不过它用选项描述换了个说法，让你判断哪种情况下必须用ETag。

CDN的缓存策略也偶尔出现，考点无非是Cache-Control: s-maxage与max-age的区别：s-maxage只对CDN缓存生效，而max-age对浏览器本地缓存生效。这个点如果在备考时没注意，很容易选错，因为它考得非常细。

4.3 回流和重绘的优化方向

回流和重绘的触发条件，笔试喜欢用“下面哪个做法可以减少回流”来考。正确的方向包括批量修改DOM、使用class切换样式、避免频繁读取offset等布局属性、使用transform代替top/left动画等。

这里我想提醒一个大家容易记错的点：transform动画不会触发回流重绘，而是直接进入合成阶段，由GPU处理。但读offsetWidth会强制同步布局，如果你在改完样式后立刻读它，性能消耗最大。原因在于修改样式后，浏览器需要重新计算布局，但通常它会攒在一起批量处理；当你立即读取布局属性时，为了给你最新的值，浏览器不得不立刻执行一次布局计算，这样之前攒着的修改就失去了批处理的意义。

笔试中碰到了与Performance相关的选择题，就考了这一点。我当时把常见的触发回流的操作整理成了一个清单：增删DOM元素、修改盒模型属性（width、height、margin、padding）、修改定位属性、读取offsetWidth/scrollWidth/getBoundingClientRect等。优化方向归纳为三个：减少次数、减少范围、避免强制同步。

5. 前端框架与工程化：框架题不只是背API

百度笔试的框架题特点很鲜明：不会让你写一段React组件，也不会让你记住Hooks的用法列表，而是考框架底层的原理和设计思想。比如虚拟DOM的diff算法、key的作用、useEffect的依赖机制、Vue3响应式与Vue2的区别。

5.1 React虚拟DOM与diff算法考点

虚拟DOM在笔试中最常见的考法是：虚拟DOM是什么？它比直接操作DOM快吗？这里有一个经典的“坑”：虚拟DOM并不总是比原生DOM操作更快。它真正的价值在于把“命令式操作DOM”变成了“声明式描述UI”，让框架可以在数据变化时批量计算最终需要变更的DOM节点，减少不必要的操作，同时提供跨平台能力。

diff算法考点里，key的作用占据了核心位置。列表渲染时使用key，可以帮助React识别哪些元素发生了改变、新增或删除。但这里要强调一点：key不是用来提升渲染性能的，正确使用key可以减少节点复用时的重复渲染；但如果key乱用，比如用数组索引当key，在列表顺序变化时反而会造成状态错乱。有一年笔试考了“列表项中间插入一条数据，使用index作为key会有什么问题”，答案是项的状态可能会被复用，导致输入框内容错乱。

5.2 Vue3响应式原理与Vue2的差异

Vue3的响应式是面试高频点，笔试常考它和Vue2的差异。Vue2使用Object.defineProperty，Vue3使用Proxy。两者最核心的区别在于：defineProperty只能拦截对象属性的读取和赋值，无法拦截属性的新增、删除、数组索引变化；Proxy可以拦截整个对象的13种操作，包括in操作符、delete、ownKeys等，所以Vue3能够做到“新增属性也是响应式的”。

多选题曾经问过Vue3Ref和reactive的区别。Ref包装的是基本类型值，也可以包装对象，但访问时要通过.value；Reactive只能接收对象，访问时直接obj.xxx。这里有个记忆技巧：Ref的本质是创建一个RefImpl实例，内部用reactive对象的value来存储实际数据，所以Ref包装对象时，修改obj.value.name同样能触发更新。

5.3 Webpack、Vite与前端性能优化

工程化题不会让你手写配置，但会考概念。比如Tree Shaking依赖ES Module的静态结构，因此import { a } from './module'可以被摇树，而CommonJS的require('./module')不行。再比如懒加载借助动态import()，实际是在构建时把单独的代码块拆成一个chunk，运行时按需加载，减少首屏包体积。

Vite高频考的是它的开发模式为什么快：Vite利用浏览器原生ES Module，按需加载源文件，而不是像Webpack那样先打包完再启动服务。所以项目大了之后Webpack冷启动可能要几十秒，Vite基本秒开。这个对比几乎每次都会出现，建议特意记一下“依赖预构建”（用esbuild）和“源码按需编译”这两个关键术语。

性能优化题相对比较综合，不局限于工程化。我遇到的是一道图片加载场景题：首屏图片用CDN + WebP + 懒加载，字体文件用font-display: swap。如果只从工程角度回答，方向就是拆包、压缩、缓存、边缘计算这一套。

6. 算法与编程题：拉开差距的核心战场

百度笔试的编程题一般是2到3题，其中一题简单偏中等，另一题中等偏难，如果只有两题那第二题多半带一点DP或贪心味道。这里不要求你AC全部测试用例，但通过的测试用例比例直接影响面试官对你的初始评价，所以尽量把能想到的边界都处理好。

6.1 真题风格复盘：中等偏经典，逻辑要严密

秋招阶段大家会刷力扣，我的经验是刷题不必追求“死磕Hard”，把高频题型的模板和套路搞清楚更关键。比如最长无重复子串、二叉树层序遍历、LRU缓存、三数之和、接雨水，这五道题几乎覆盖了滑动窗口、BFS、哈希表、双指针、单调栈等核心思想。

我那次遇到的一道编程题是“给定两个字符串形式的数字，返回它们相乘的结果，不能用BigInt”，这题本质上考大数乘法，需要模拟竖式。核心思路是用一个数组先按位相乘累加，再统一处理进位，最后把前导零去掉。仔细敲完代码，通过率能到90%以上，剩下的就是处理边界：如果两个字符串里有一个是"0"，直接返回"0"。

另一道题是二叉树相关，要求判断一棵树是不是对称二叉树。最简单清晰的解法是递归判断左右子树：左子树的左孩子等于右子树的右孩子，左子树的右孩子等于右子树的左孩子，这个对称关系很直观。这道题在LeetCode上是Easy，放在笔试里属于送分题，但很多人在递归终止条件上出了问题：只判断了节点是否为空，忘了判断值是否相等，导致错误。

6.2 输入输出处理和边界条件的经验

在线编程环境用的是赛码网，输入输出格式和力扣不同。如果平时只写函数，不练全流程，考场上很容易卡在输入读取上。我当时提前熟悉了readline的用法：

const readline = require('readline'); const rl = readline.createInterface({ input: process.stdin, output: process.stdout }); rl.on('line', (line) => { const nums = line.trim().split(' ').map(Number); console.log(solve(nums)); });

编程题里最常见的三个坑，我一一踩过：

第一个是字符串输入里混了多余空格，最稳妥的办法是先用trim()去掉两端空白再split。第二个是输出格式要求末尾不能有多余空格，可以用数组收集结果后join(' ')再统一输出。第三个是Number类型在超大整数相乘时精度丢失，但题目又偏偏让你处理超过Number.MAX_SAFE_INTEGER的数，这时候要么用字符串模拟，要么用BigInt，我个人建议字符串模拟更保险，因为部分评测机对BigInt的支持和性能并不稳定。

6.3 值得提前刷的题型清单

结合百度的出题偏好和我自己在牛客上刷面经整理的规律，以下题型优先级最高：

老生常谈但还是要强调：刷题别贪多，每道题做完最好把思路在注释里写清楚，否则过两周回来跟没做过一样。我习惯用“三遍法”：第一遍自己AC，第二遍隔天看题直接讲思路，第三遍重新手写代码不看答案。这样刷下来，中等题基本能形成条件反射。

7. 笔试环境与答题策略：细节决定成败

很多人只关注知识复习，忽略了笔试环境本身的影响。在线笔试和本地IDE差别很大，某些细节如果没有提前适应，考场上会白白丢分。

7.1 赛码笔试环境需要提前熟悉的操作

赛码网的编辑器不带自动保存，切换题目时会有弹窗提示，但如果你在最后几分钟还在改代码，很容易因为切题导致未提交。我的建议是每做完一道题，第一时间点保存并提交，后续再做题就默认这道题已有提交记录，心里踏实很多。第二点是代码编辑器支持本地调试和运行示例，但只支持单文件调试，如果你在代码里粘贴了多个函数，又没调用，运行结果可能不符合预期。所以试卷里的编程题最好按题号拆成独立文件，不要把所有题的代码堆在一起。

我还发现赛码网对Node.js的版本支持在特定年份有差异，比如某些版本不支持ES Module的import语法。所以我写在线笔试代码时，尽量用CommonJS的require/ module.exports，避免因为环境语法报错而空耗时间。

7.2 120分钟的时间分配策略

我的时间安排是：前40分钟做完全部选择题，剩下的时间全部给编程题。选择题中遇到犹豫超过一分钟的题，先标记跳过，最后再回来看。这样做有两个好处：一是优先拿到确定性的分数，二是避免在一道选择题上纠缠太久，导致后面编程题没时间写。

编程题我建议按“先易后难、先保底后拔高”的策略。如果第一题简单，直接写完并测试完整用例；第二题如果中等偏难，先写出暴力解并保证通过案例，再考虑优化；要是完全没思路，那就把基础的输入处理和题目示例跑通，至少保证没人空着交卷。

7.3 选择题的涂卡式策略与多选题的得分技巧

多选题宁可少选，不要多选。百度笔试规定选错不得分，但少选往往还有部分分数，所以不确定的选项坚决不选。当时我有个多选题考的是HTTP状态码的语义，选项里有“301永久重定向、302临时重定向、304未修改、404未找到”，其中304让我犹豫，因为304在语义上其实属于重定向类，但它不同于301/302，它是服务端验证缓存后返回“未修改”。如果我没有提前搞清楚“304和重定向的关系”，很容易多选一个或者漏选一个。

单选题如果遇到彻底不会的，我用的是排除法加语义推断。前端技术名词大多有一定语义，比如“BFC”“层叠上下文”“CSS包含块”，看到含义能与题目背景吻合的选项，优先选它。这种策略不是万能，但至少比纯蒙的正确率高不少。

8. 错题复盘与备考建议：把笔试变成面试的跳板

笔试之后不要急着对完答案就完事，它是一个很好的查漏补缺工具。我对完答案后会做一个错题清单，每个错题都标注三件事：错误原因、对应知识点、参考资源。这样在准备下一家笔试或者面试时，直接看清单就能快速进入状态。

8.1 如何系统整理错题

我用的模板大概是这样的表格，每考完一家就更新一个Sheet：

错因分析一定要具体。不要写“基础不牢”这种废话，要写“我误以为no-cache是不使用缓存，实际是使用前需要协商验证”，这样下次翻看才能触发记忆。

8.2 时间紧的话，重点复习哪些内容

如果你距离笔试只剩两周，我建议按权重分配：JavaScript核心占四天，网络和浏览器占三天，框架原理占两天，算法占三天，剩下两天用于做真题模拟和错题复盘。JavaScript和算法是性价比最高的两块，短期内能显著提升正确率。

关于刷题量，我的体感是：力扣保持在150题左右，其中简单30题、中等100题、困难20题，覆盖面就已经够了。比多刷更重要的是保持手感，我考试前一周每天固定做3道中等题，雷打不动，让大脑在固定时段进入算法状态。

8.3 笔试复盘如何为面试铺路

笔试中遇到的选择题，很多都会变成面试时的追问话题。比如笔试考了“async/await和Promise的关系”，面试官就可能让你手写一个支持超时和重试的请求函数。我当时就是靠笔试复盘把事件循环、Promise、缓存这几个点揉在一起吃透的，后来面试被问到“如何设计一个带缓存Promise的请求函数”时，直接答出了几个关键优化点，面试官明显比较满意。

我的建议是，笔试结束后挑三个最薄弱的知识点，自己讲一遍，讲不通就再查资料。这个过程相当于在提前准备面试题，一举两得。

笔试本身不决定最终Offer，很多人的笔试成绩只是“通过线”，面试表现才是真正的分水岭。但从笔试中暴露出的知识盲区，如果用心补上，面试时就会变成你的加分项。这是秋招备考中我觉得最值得投入精力的部分。