先说个真事。去年秋招那会儿我在牛客上刷到一份“百度2023校招Web前端研发工程师笔试卷第三批”的帖子评论区吵得不可开交。有人说“这不就考基础吗背背八股就能过”也有人说“题量太大一道原型链卡了我二十分钟后面完全放飞”。同一张卷子两种完全不同的体感这件事本身就挺有意思的。我后来把网上能找到的各个批次、各种回忆版题目汇总在一起对着知识点清单逐条验证又找几位已经上岸的学弟学妹聊了聊实际考场感受慢慢摸清了这套笔试背后的出题逻辑。如果你正在准备前端校招或者刚入行想看看大厂到底在考什么这篇复盘应该能帮你在复习时少走很多弯路。它不是原题答案的堆砌而是把“考什么、为什么考、怎么准备”这条线完整捋清楚。1. 笔试卷的整体设计思路它到底想筛什么样的人先说结论百度这套笔试卷的考察重心不是“你会不会写页面”而是“你有没有形成完整的前端知识体系”。第三批和前面两批相比题型分布基本一致但细节上有明显调整——计算机基础相关题目占比略有上升纯记忆类题目减少场景题和代码输出题增加。这个变化在近两年的校招里是普遍趋势百度只是表现得比较典型。1.1 笔试在能力模型中的定位校招流程一般分简历筛选、笔试、技术面试、HR面。笔试的定位非常特殊它是在极短时间内用统一标准过滤大量候选人的工具。所以笔试题目设计通常遵循两个原则。第一是覆盖面广。面试只有四五十分钟能考察的技术点有限但笔试可以在90到120分钟里覆盖JavaScript、CSS、网络、浏览器原理、框架、工程化、算法等多个维度。你哪个环节薄弱分数一出来就很直观。第二是区分度高。基础题保证大多数人都能做但难题专门用来筛掉“背题但不懂原理”的候选人。百度的笔试题尤其喜欢在“看起来很简单”的代码输出题里埋坑比如this指向、事件循环、闭包变量共享这些一眼看过去答案似乎是A实际运行结果是B如果你只是背过结论而没真正理解机制这类题很容易连续翻车。1.2 第三批笔试卷的宏观结构结合几位参加过的同学反馈这套卷子大体可以分成四块题型大致题量主要考察方向单选题15-20题基础语法、网络协议、浏览器机制、CSS特性多选题5-10题知识点边界辨析、多选易错项简答/程序输出题4-6题事件循环、this、闭包、原型链、Promise编程题2-3题算法与手写实现、DOM操作场景时间一般是90分钟到120分钟平均每道选择题只有一分半钟编程题大概留20到30分钟。这个节奏就意味着如果你在单个知识点上犹豫太久后面的大题基本没时间做。很多人考完出来说“题其实不难就是没做完”多半是时间分配出了问题。1.3 “第三批”的特殊性在哪里同一家公司多批次笔试题目并不是完全独立的。按往年规律第一批偏基础试点第二批开始加大难度第三批往往整合了前面批次正确率较低的知识点再用新角度重新出题。也就是说你光刷第一批的真题可能练的都是基础题到第三批考场上一看同样的知识点换了个包装立刻就不会了。我见过最典型的例子是事件循环。第一批可能直接问你setTimeout和Promise的执行顺序第三批就换成async/await嵌套加微任务队列的变体再叠加一个宏任务里创建新微任务的场景。表面看都是“事件循环”实际考察的深度完全不一样。所以备考时不能只记结论要把事件循环的完整机制宏任务队列、微任务队列、每轮循环的执行顺序彻底搞懂才能应对各种变形。2. 核心考点拆解高频知识点的出题角度与原理分析大厂前端笔试虽然题面各不相同但核心考点高度集中。我按重要程度排序把最常考的几块逐个拆开讲每个部分都会说明“出题人想考什么”和“你需要理解到什么程度”。2.1 JavaScript语言核心原型链、this、闭包这一块是绝对的送命题重灾区。先说原型链。典型出题方式是给你一段构造函数加原型方法的代码然后问你new出来的实例能不能调到某个方法或者instanceof的判定结果是什么。这类题的底层逻辑其实就一条对象在查找属性时会沿着__proto__一路向上找直到Object.prototype.__proto__为null。但笔试不会直接这么问它会把“原型链的尽头是谁”“Function 和 Object 之间谁是谁的原型”这种绕来绕去的问题包装成选择题。我自己的经验是理解原型链没必要死记层级图只要抓住两条规则。第一对象.__proto__ 构造该对象的函数.prototype。第二函数也是一种对象所以函数也有 __proto__而函数的构造函数是 Function所以函数.__proto__ Function.prototype。这两条规则推演出来的所有层级关系都是自洽的考场上遇到不熟悉的组合也能现推。再看 this 指向。笔试喜欢出的是“对象方法里的 this 解构赋值 严格模式”组合题。比如从对象里解构出一个方法再单独调用此时方法内部的 this 指向什么。很多人只知道“谁调用指向谁”但一碰到解构、回调、事件绑定就懵。这里需要补充一个更底层的规定this 的指向取决于函数被调用时的引用环境而不是定义时的上下文。箭头函数是个例外它没有自己的 this会捕获定义时外层作用域的 this。闭包这块最常见的出题形式是循环里用 var 声明变量并注册事件回调问最终点击输出什么。标准答案是所有回调共享同一个变量输出循环结束后的值。这道题背后考的是作用域链和变量捕获机制理解了闭包的本质是“函数 对定义时外层作用域的引用”就能明白为什么 var 声明的变量会被共享。解决方案也由原理推导出来要么用 let 创建块级作用域要么用立即执行函数IIFE生成新的闭包环境。2.2 异步与事件循环宏任务、微任务的执行顺序这道题在百度笔试里几乎是固定出场。常见形态是给你下面这样一段代码让你写出输出顺序console.log(start); setTimeout(() { console.log(timeout); }, 0); Promise.resolve().then(() { console.log(promise); }); console.log(end);标准答案是start - end - promise - timeout。这个结论背后是事件循环的核心机制JavaScript 引擎一次只能执行一个任务同步代码先全部执行完然后才处理异步任务。异步任务又分宏任务和微任务每个宏任务执行完毕后会清空当前微任务队列然后才进入下一个宏任务。setTimeout 的回调属于宏任务Promise 的 then 回调属于微任务。所以上面的输出顺序就是同步代码先跑完然后微任务promise先于宏任务timeout执行。但笔试不会总出这么善良的题目它会在中间塞入多个 Promise、async/await、嵌套 setTimeout甚至把 process.nextTick 也放进来Node 环境。这时你就需要掌握完整的执行顺序规则同步代码 - 全部微任务按入队顺序- 宏任务 - 新产生的微任务 - 下一轮宏任务。注意宏任务每执行完一个就要回到微任务队列清空一次而不是等所有宏任务都执行完再统一处理微任务。我备考时专门用表格整理过各种 API 的任务类型setTimeout、setInterval、setImmediate 属于宏任务Promise.then/catch/finally、queueMicrotask、MutationObserver 属于微任务process.nextTick 属于 Node 环境里比普通微任务更早执行的特殊微任务。考试时把任务按这个表归类再按轮次推进基本不会错。2.3 CSS 布局与样式细节看起来简单丢分率极高很多同学复习 CSS 就是过一遍 flex 和 grid觉得笔试不会怎么考。实际上百度笔试里 CSS 占比不低而且特别喜欢出“边界情况”和“经典布局实现”题目。经典布局题里两栏/三栏布局出镜率极高。常见问法是“左侧固定宽度 200px右侧自适应有几种实现方式”。至少要能说出 float margin、flex、grid、绝对定位这几种并简单说明各自的优缺点。flex 实现最简洁.container { display: flex; } .left { flex: 0 0 200px; } .right { flex: 1; }这里的知识点是 flex 的三个属性简写flex-grow放大比例、flex-shrink缩小比例、flex-basis初始主轴尺寸。flex: 1等价于1 1 0%flex: 0 0 200px等价于不放大、不缩小、固定 200px。理解了这个笔试里变化各种flex参数的题目也能应对。另一种高频题目是“元素水平垂直居中”的实现方案。flex、grid、绝对定位 transform、margin: auto 这些都要能写出来。容易被忽略的是绝对定位 margin: auto 的方案.father { position: relative; } .child { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 100px; height: 100px; }这个方案的原理是绝对定位元素在可定位区域内如果上右下左都设为 0再配合 margin: auto浏览器会自动把剩余空间均分到四个方向从而实现居中。笔试里问“不用 flex 和 grid如何实现水平垂直居中”这个方案就是标准答案之一。还有一类是 CSS 属性的细节辨析比如visibility: hidden和display: none的区别、position: sticky的生效条件、z-index在什么情况下失效。这些知识点不难但非常零碎我建议用碎片时间刷题来巩固而不是专门拿一大块时间去背。3. 手写题与算法题实战从解题思路到代码实现编程题是拉分的关键。百度笔试的编程题一般是两个层次一个偏算法通常以 LeetCode 中等题为主一个偏前端手写场景比如实现某个函数、封装某个组件逻辑。下面挑最有代表性的几类详细拆解。3.1 高频手写题防抖、节流、深拷贝、Promise防抖和节流是前端笔试的“老演员”出题概率极高。防抖的核心思想是事件触发后等待一段时间再执行如果等待期间再次触发则重新计时。节流的核心思想是一段时间内只执行一次。防抖的经典实现function debounce(fn, delay) { let timer null; return function (...args) { if (timer) clearTimeout(timer); timer setTimeout(() { fn.apply(this, args); }, delay); }; }这个实现里有两个细节要注意。第一回调函数里必须fn.apply(this, args)因为直接调用fn(args)会丢失 this 绑定在事件处理场景下 this 本来应该指向绑定事件的元素。第二timer必须保存在闭包变量里每次调用返回的新函数时都能访问到同一个 timer才能实现“重新计时”的效果。节流的实现有两种常见方式时间戳版和定时器版。时间戳版在第一次触发时立即执行但停止触发后不会再有最后一次执行定时器版在停止触发后还会执行最后一次但第一次触发会有延迟。笔试如果要求“实现一个节流函数”两种都写出来再说明区别是很好的加分项。深拷贝的坑比想象中多。面试官或笔试阅卷人想看到的实现至少要处理三种情况循环引用、特殊类型Date、RegExp、Map、Set、symbol 和不可枚举属性。一个较完整的深拷贝实现function deepClone(obj, hash new WeakMap()) { if (obj null || typeof obj ! object) return obj; if (obj instanceof Date) return new Date(obj); if (obj instanceof RegExp) return new RegExp(obj); if (hash.has(obj)) return hash.get(obj); const target new obj.constructor(); hash.set(obj, target); for (let key of Reflect.ownKeys(obj)) { target[key] deepClone(obj[key], hash); } return target; }用 WeakMap 存映射关系是为了解决循环引用——当对象里某个属性引用了自身时再次递归会无限循环而 WeakMap 在遍历时如果发现这个对象已经存过直接返回之前的克隆结果就断掉了环。Reflect.ownKeys 可以同时拿到字符串 key 和 symbol key比 Object.keys 更全面。Promise 相关的手写题一般是 Promise.all、Promise.race或者是串行执行多个异步任务。Promise.all 的实现关键点是结果顺序要和传入顺序一致不管 Promise 完成的先后顺序如何。function promiseAll(promises) { return new Promise((resolve, reject) { const result []; let count 0; for (let i 0; i promises.length; i) { Promise.resolve(promises[i]).then((value) { result[i] value; count; if (count promises.length) resolve(result); }, reject); } }); }注意这里不能直接result.push(value)因为各 Promise 完成顺序不定push 会导致结果顺序错乱。先占位再赋值才能保证顺序。3.2 算法题的典型思路算法题的范围比较广但百度笔试常见的是字符串处理、数组操作、二叉树遍历、动态规划简单题。准备时优先刷 LeetCode 的 Top 100 高频题特别是其中的简单和中等难度。举一个典型例子给定两个字符串形式的数字求它们的和禁止使用 BigInt。这道题考察的是大数相加的手算模拟。核心思路是从低位开始逐位相加记录进位最后反转结果。function addStrings(a, b) { let i a.length - 1; let j b.length - 1; let carry 0; let res []; while (i 0 || j 0 || carry) { const x i 0 ? Number(a[i--]) : 0; const y j 0 ? Number(b[j--]) : 0; const sum x y carry; res.push(sum % 10); carry Math.floor(sum / 10); } return res.reverse().join(); }这类题目的考察点不是你会不会用现成 API而是遇到超出常规类型限制的问题时能不能用基础数据结构手动模拟。这背后的能力是“逻辑分解”把大问题拆成小步骤逐步实现。前端日常工作里很需要这种能力。3.3 DOM 场景题把原生 API 用对编程题里偶尔会出现 DOM 操作场景题比如“实现一个函数把某个节点下的所有文本节点内容中包含指定关键词的部分高亮”。这类题考察原生 DOM API 的熟练程度以及递归遍历的能力。常规解法思路是先遍历所有子节点判断 nodeType如果是文本节点nodeType 3检查内容并做替换如果是元素节点继续递归遍历子节点。操作时要注意文本节点的指针移动因为替换文本内容可能会影响遍历位置。不过说实话这类题在大厂笔试里出现频率不算特别高因为线上判题系统不方便模拟真实 DOM 环境。如果出现更多是简答题形式让你描述思路而不是完整写代码。准备时重点记住 TreeWalker 或 NodeIterator 可以用来遍历 DOM以及 textContent 和 innerHTML 的区别基本够用。4. 网络、浏览器与安全笔试里的“隐形成本”JavaScript 和算法是前端笔试的显性权重但网络、浏览器、安全这块内容往往是“压垮骆驼的最后一根稻草”。很多同学编程题答得很好反而在选择题里丢了不少分。这一块知识覆盖范围广、内容庞杂如果没有系统梳理很容易被出题人设置的“陷阱选项”带走。4.1 HTTP 核心考点缓存、状态码、HTTPSHTTP 相关题目重点在缓存机制。常见的出题方式是给出几个响应头问资源的缓存策略。这里有一个容易混淆的知识点强缓存和协商缓存的区别。强缓存就是浏览器不向服务器发请求直接读本地缓存由Cache-Control和Expires控制。协商缓存是浏览器向服务器确认资源是否过期由Last-Modified/If-Modified-Since和ETag/If-None-Match控制服务器返回 304 时使用本地缓存200 时返回新资源。需要特别注意Cache-Control里的几个字段no-cache不是不缓存而是每次使用前必须向服务器验证no-store才是真正的不缓存max-age的单位是秒s-maxage只对 CDN 等共享缓存生效。这些细节在笔试里出现频率非常高也是容易记混的地方。状态码考察集中在 301、302、304、400、401、403、404、500、502、503。有个经典易错点是 301 和 302 的区别301 是永久重定向浏览器会缓存重定向结果302 是临时重定向每次都需要重新请求原地址。还有一个冷门但偶尔出现的303 是“查看其他位置”常用于表单提交后的重定向语义上区别于 307/308保持请求方法和主体不变的重定向。HTTPS 的握手流程也是选择题常客。简化版的记忆口诀是“一RSA二证书三密钥四加密”。更严谨地说TLS 握手过程大致是客户端发送支持的加密套件列表和随机数 → 服务器回复证书和随机数 → 客户端验证证书并生成预主密钥用服务器公钥加密后发送 → 服务器用私钥解密得到预主密钥双方各自计算出会话密钥 → 之后用会话密钥对称加密通信。笔试里最常问的是“HTTPS 握手中哪一步用于验证服务器身份”答案就是“客户端验证服务器证书”这一步。4.2 浏览器渲染机制重排、重绘、合成浏览器的渲染流程是前端性能优化的理论基础也是笔试常考点。完整的渲染流程是HTML 解析生成 DOM 树CSS 解析生成 CSSOM 树两者合并成渲染树Render Tree然后进行布局Layout、绘制Paint最后合成Composite。这里常见题目是“以下哪个属性修改会触发重排reflow而不是重绘repaint”。答案是修改 width、height、margin、padding、top、left 这些影响几何信息的属性会触发重排修改 color、background-color 这些不影响布局的属性只触发重绘。单纯触发重绘的开销比重排小所以性能优化的一个方向就是减少重排。出题还会延伸到requestAnimationFrame、will-change、transform/opacity为什么能触发 GPU 合成而避免重排。注意transform虽然看起来是“位移”但它不触发重排也不触发重绘而是直接进入合成阶段因为 transform 不会影响其他元素的布局也不会改变元素自身在文档流中的占位。这种“为什么”层面的理解比死记哪些属性触发重绘更重要。4.3 前端安全XSS 与 CSRF安全类题目在前端笔试里占比不大但属于“高频考点中的稳定项”。两道题必考XSS 和 CSRF 是什么、怎么防御。XSS跨站脚本攻击的核心是攻击者把恶意脚本注入到页面中执行。常见类型有三种存储型恶意脚本存在服务器数据库里比如评论区、反射型恶意脚本通过 URL 参数反射回页面、DOM 型纯前端通过 DOM 操作把恶意内容插入页面。防御的通用原则是“不信任用户输入”对外部数据做转义对 HTML 标签进行编码使用 CSP内容安全策略限制脚本来源。CSRF跨站请求伪造的核心是攻击者诱导用户在已登录的网站上执行非本意的操作比如通过一个隐藏表单自动提交请求。防御方案一般是加 CSRF Token服务器下发随机 token提交时校验、校验 Referer/Origin 请求头、设置 Cookie 的SameSite属性为Lax或Strict。笔试里直接让你选“下面哪个能防御 CSRF”你要能分辨出这三者都是正确答案的方向而“给接口加上 CORS”是错误的因为 CORS 只控制浏览器跨域请求是否被允许读取响应并不能阻止请求本身的发送。这一块容易掉分的点在于 XSS 和 CSRF 的概念混淆。我建议用一句话区分XSS 是“攻击者把脚本塞到你的页面里”CSRF 是“攻击者借用你的身份去发请求”。一个是对页面本身攻击一个是对用户身份滥用。备考时把这个区别刻在脑子里很多选择题直接秒选。5. 框架与工程化从“会用”到“说清原理”Vue 或 React 几乎是大厂前端的必问项笔试里通常以选择题或简答题形式出现。考的不是会不会写而是理不理解设计思想和底层原理。5.1 Vue 与 React 的核心差异笔试题目常见的问法是“Vue 和 React 在数据更新机制上有什么区别”。标准回答脉络是Vue 2 使用 Object.defineProperty 实现响应式Vue 3 使用 ProxyReact 默认通过 setState 触发更新需要手动配合不可变数据。Vue 的依赖收集是自动的、精确的React 需要从根组件向下协调reconciliation。但这只是第一层。真正的加分回答是能进一步说明两者设计目标的差异Vue 追求“更少的开发者心智负担”框架替你做依赖追踪React 追求“可预测的状态管理”数据流向更明确配合函数式组件和不可变数据便于做时间旅行调试。笔试简答时能说出这一层分数一般不会低。虚拟 DOM 也是必考点。问“虚拟 DOM 是什么”“key 的作用是什么”。key 的核心作用是让 diff 算法能识别哪些节点是稳定的、哪些是发生变化的。如果用数组 index 作为 key在列表顺序变化或头部插入时会导致错误的节点复用引发渲染 bug。笔试里会给出一个动态列表的场景问“下列哪种写法会有性能问题”答案就是 index 作为 key 的情况。5.2 工程化基础模块化、打包工具、性能优化webpack 相关的题目主要集中在三个层面构建流程、loader 和 plugin 的区别、常见优化手段。loader 和 plugin 的区别是高频考点。loader 本质上是文件转换器把非 JS 模块比如 CSS、图片、TypeScript转换成 webpack 能处理的模块plugin 本质上是构建生命周期钩子可以在打包的各个阶段做一些自定义操作比如压缩代码、生成 HTML 文件、提取公共代码。一句话总结loader 管“怎么处理某个文件”plugin 管“整个构建过程能做什么”。性能优化题目一般会让你分析某个页面的加载优化方案。这类题比较开放可以从网络层面CDN、HTTP 缓存、资源压缩、构建层面代码分割、tree-shaking、懒加载、渲染层面减少重排重绘、图片懒加载三个维度来作答。笔试答题时按这个框架展开不会有遗漏。5.3 手写“迷你框架”类题目怎么准备有一个比较进阶的题型是让你实现一个简版响应式系统或者实现一个迷你版 Vue 的依赖收集。这类题在笔试中属于拔高题出现了会拉高区分度。最核心的机制是“发布-订阅模式”读取数据时收集依赖订阅者修改数据时通知依赖更新发布。Vue 3 的 effect track trigger 就是这套逻辑。如果笔试时真遇到先写出最简版本再逐步补充边界情况比空着手强得多。我准备这种题时的方法是自己用 50 行代码实现一个极简的响应式类核心就三步定义 Reactive 类借助 Proxy 拦截 get 和 setget 时把当前活跃的 effect 函数收集到依赖集合里set 时遍历触发依赖集合里的所有 effect。写过一遍之后很多关于响应式的抽象概念就具象化了。6. 常见失分点与备考建议避免“题都会分不高”笔试刷题最大的挫败感来自“题目我都见过但就是做错”。我复盘了网上大量第三批笔试题讨论帖总结了几个高频失分点每一条都是血泪教训。6.1 失分点一多选题当单选题做大厂笔试题里多选题的扣分规则很严格多选、少选、错选都不得分。很多同学平时刷题只刷单选到考场上按“排除掉错误项”的思路去做多选题结果漏选了正确项。备考时要专门练习多选题而且不只是背答案要能说清楚每个选项为什么对、为什么错。一道涉及 HTTP 状态码的多选题如果四个选项分别对应 302、304、400、503你要能做到不仅判断出哪些是正确的还要解释每个状态码的语义和常见场景。这样才能避免漏选。6.2 失分点二手写题细节处理不完整手写函数的考察点不只是“功能是否实现”还有“边界情况是否处理”。比如深拷贝没处理循环引用、防抖函数没处理 this 指向、Promise.all 没处理传入空数组的情况这些都会扣分。我的建议是平时练习时不要看一眼答案就觉得会了要自己手写一遍然后对照标准实现逐行检查细节。重点检查参数类型校验、返回值类型、边界条件空数组、空对象、非法输入、this 绑定是否正确。笔试界面通常没有自动补全也没有报错提示代码只能靠“一遍写对”平时练得越严谨考场上越能保持稳定。6.3 失分点三时间分配不合理整套卷子 90 到 120 分钟建议的分配方式是单选题控制在 25 分钟内多选题 15 分钟简答和程序输出题 30 分钟编程题留足 30 分钟以上。程序输出题看起来简短但实际推导过程可能很耗时间不要恋战60 秒没有思路就先跳过把时间留给更有把握的题目。有个实用技巧是先把整份卷子的题目全部扫一遍把一眼能看出答案的题目立刻做掉标记不确定的题最后回来再推敲。这样做的好处是保证“会的题都对”不会出现“难题写完了简单题没时间做”的遗憾。6.4 针对性复习路线如果时间有限优先级建议这样排第一梯队是 JavaScript 核心原型链、this、闭包、事件循环、异步第二梯队是 HTTP 缓存与浏览器渲染、CSS 经典布局第三梯队是框架原理、工程化、安全第四梯队是算法刷题每天固定两三道保持手感。战线拉长的话我还会建议“以点带面”复习。拿到一道题不要只看正确答案要把这道题涉及的所有相关知识点都梳理一遍。比如碰到一道关于new操作符的题就顺手把new的实现原理、constructor属性、instanceof的原理一起复习了。这样刷十套真题基本等于过了一遍完整的知识体系。7. 最后一个建议像出题人一样去复习笔试复习到最后阶段我最大的感悟是与其不停刷题不如试着站到出题人的角度去思考。如果你来出这套卷子你会考哪些知识点你会在哪些地方设置陷阱这个问题想明白了复习方向就会很清楚。出题人想找的候选人不是“背过所有八股文”的人而是能够理解原理、灵活应变、在时间压力下还能保持代码质量的人。所以复习的核心始终是“理解机制”而不是“记住结论”。用我自己很喜欢的例子收尾。我刷到过一道很经典的题目问数组的sort()方法默认排序方式是什么。很多人回答“从小到大”但正确答案是“按照字符串的 Unicode 码点排序”——所以[10, 9, 100].sort()的结果是[10, 100, 9]。这道题考的不是你记没记住 sort 的规则而是你有没有“所有 API 都会有自己的设计细节”这种意识。前端各个知识点看起来零散但底层的思维方式是相通的永远不要凭感觉下结论去看规范去理解设计者的意图。下次再看到“百度2023校招Web前端研发工程师笔试卷”这类真题别急着背答案先问自己一句这道题想考察的能力是什么如果每次都能答上来你离上岸就真的不远了。
先说个真事。去年秋招那会儿我在牛客上刷到一份“百度2023校招Web前端研发工程师笔试卷第三批”的帖子评论区吵得不可开交。有人说“这不就考基础吗背背八股就能过”也有人说“题量太大一道原型链卡了我二十分钟后面完全放飞”。同一张卷子两种完全不同的体感这件事本身就挺有意思的。我后来把网上能找到的各个批次、各种回忆版题目汇总在一起对着知识点清单逐条验证又找几位已经上岸的学弟学妹聊了聊实际考场感受慢慢摸清了这套笔试背后的出题逻辑。如果你正在准备前端校招或者刚入行想看看大厂到底在考什么这篇复盘应该能帮你在复习时少走很多弯路。它不是原题答案的堆砌而是把“考什么、为什么考、怎么准备”这条线完整捋清楚。1. 笔试卷的整体设计思路它到底想筛什么样的人先说结论百度这套笔试卷的考察重心不是“你会不会写页面”而是“你有没有形成完整的前端知识体系”。第三批和前面两批相比题型分布基本一致但细节上有明显调整——计算机基础相关题目占比略有上升纯记忆类题目减少场景题和代码输出题增加。这个变化在近两年的校招里是普遍趋势百度只是表现得比较典型。1.1 笔试在能力模型中的定位校招流程一般分简历筛选、笔试、技术面试、HR面。笔试的定位非常特殊它是在极短时间内用统一标准过滤大量候选人的工具。所以笔试题目设计通常遵循两个原则。第一是覆盖面广。面试只有四五十分钟能考察的技术点有限但笔试可以在90到120分钟里覆盖JavaScript、CSS、网络、浏览器原理、框架、工程化、算法等多个维度。你哪个环节薄弱分数一出来就很直观。第二是区分度高。基础题保证大多数人都能做但难题专门用来筛掉“背题但不懂原理”的候选人。百度的笔试题尤其喜欢在“看起来很简单”的代码输出题里埋坑比如this指向、事件循环、闭包变量共享这些一眼看过去答案似乎是A实际运行结果是B如果你只是背过结论而没真正理解机制这类题很容易连续翻车。1.2 第三批笔试卷的宏观结构结合几位参加过的同学反馈这套卷子大体可以分成四块题型大致题量主要考察方向单选题15-20题基础语法、网络协议、浏览器机制、CSS特性多选题5-10题知识点边界辨析、多选易错项简答/程序输出题4-6题事件循环、this、闭包、原型链、Promise编程题2-3题算法与手写实现、DOM操作场景时间一般是90分钟到120分钟平均每道选择题只有一分半钟编程题大概留20到30分钟。这个节奏就意味着如果你在单个知识点上犹豫太久后面的大题基本没时间做。很多人考完出来说“题其实不难就是没做完”多半是时间分配出了问题。1.3 “第三批”的特殊性在哪里同一家公司多批次笔试题目并不是完全独立的。按往年规律第一批偏基础试点第二批开始加大难度第三批往往整合了前面批次正确率较低的知识点再用新角度重新出题。也就是说你光刷第一批的真题可能练的都是基础题到第三批考场上一看同样的知识点换了个包装立刻就不会了。我见过最典型的例子是事件循环。第一批可能直接问你setTimeout和Promise的执行顺序第三批就换成async/await嵌套加微任务队列的变体再叠加一个宏任务里创建新微任务的场景。表面看都是“事件循环”实际考察的深度完全不一样。所以备考时不能只记结论要把事件循环的完整机制宏任务队列、微任务队列、每轮循环的执行顺序彻底搞懂才能应对各种变形。2. 核心考点拆解高频知识点的出题角度与原理分析大厂前端笔试虽然题面各不相同但核心考点高度集中。我按重要程度排序把最常考的几块逐个拆开讲每个部分都会说明“出题人想考什么”和“你需要理解到什么程度”。2.1 JavaScript语言核心原型链、this、闭包这一块是绝对的送命题重灾区。先说原型链。典型出题方式是给你一段构造函数加原型方法的代码然后问你new出来的实例能不能调到某个方法或者instanceof的判定结果是什么。这类题的底层逻辑其实就一条对象在查找属性时会沿着__proto__一路向上找直到Object.prototype.__proto__为null。但笔试不会直接这么问它会把“原型链的尽头是谁”“Function 和 Object 之间谁是谁的原型”这种绕来绕去的问题包装成选择题。我自己的经验是理解原型链没必要死记层级图只要抓住两条规则。第一对象.__proto__ 构造该对象的函数.prototype。第二函数也是一种对象所以函数也有 __proto__而函数的构造函数是 Function所以函数.__proto__ Function.prototype。这两条规则推演出来的所有层级关系都是自洽的考场上遇到不熟悉的组合也能现推。再看 this 指向。笔试喜欢出的是“对象方法里的 this 解构赋值 严格模式”组合题。比如从对象里解构出一个方法再单独调用此时方法内部的 this 指向什么。很多人只知道“谁调用指向谁”但一碰到解构、回调、事件绑定就懵。这里需要补充一个更底层的规定this 的指向取决于函数被调用时的引用环境而不是定义时的上下文。箭头函数是个例外它没有自己的 this会捕获定义时外层作用域的 this。闭包这块最常见的出题形式是循环里用 var 声明变量并注册事件回调问最终点击输出什么。标准答案是所有回调共享同一个变量输出循环结束后的值。这道题背后考的是作用域链和变量捕获机制理解了闭包的本质是“函数 对定义时外层作用域的引用”就能明白为什么 var 声明的变量会被共享。解决方案也由原理推导出来要么用 let 创建块级作用域要么用立即执行函数IIFE生成新的闭包环境。2.2 异步与事件循环宏任务、微任务的执行顺序这道题在百度笔试里几乎是固定出场。常见形态是给你下面这样一段代码让你写出输出顺序console.log(start); setTimeout(() { console.log(timeout); }, 0); Promise.resolve().then(() { console.log(promise); }); console.log(end);标准答案是start - end - promise - timeout。这个结论背后是事件循环的核心机制JavaScript 引擎一次只能执行一个任务同步代码先全部执行完然后才处理异步任务。异步任务又分宏任务和微任务每个宏任务执行完毕后会清空当前微任务队列然后才进入下一个宏任务。setTimeout 的回调属于宏任务Promise 的 then 回调属于微任务。所以上面的输出顺序就是同步代码先跑完然后微任务promise先于宏任务timeout执行。但笔试不会总出这么善良的题目它会在中间塞入多个 Promise、async/await、嵌套 setTimeout甚至把 process.nextTick 也放进来Node 环境。这时你就需要掌握完整的执行顺序规则同步代码 - 全部微任务按入队顺序- 宏任务 - 新产生的微任务 - 下一轮宏任务。注意宏任务每执行完一个就要回到微任务队列清空一次而不是等所有宏任务都执行完再统一处理微任务。我备考时专门用表格整理过各种 API 的任务类型setTimeout、setInterval、setImmediate 属于宏任务Promise.then/catch/finally、queueMicrotask、MutationObserver 属于微任务process.nextTick 属于 Node 环境里比普通微任务更早执行的特殊微任务。考试时把任务按这个表归类再按轮次推进基本不会错。2.3 CSS 布局与样式细节看起来简单丢分率极高很多同学复习 CSS 就是过一遍 flex 和 grid觉得笔试不会怎么考。实际上百度笔试里 CSS 占比不低而且特别喜欢出“边界情况”和“经典布局实现”题目。经典布局题里两栏/三栏布局出镜率极高。常见问法是“左侧固定宽度 200px右侧自适应有几种实现方式”。至少要能说出 float margin、flex、grid、绝对定位这几种并简单说明各自的优缺点。flex 实现最简洁.container { display: flex; } .left { flex: 0 0 200px; } .right { flex: 1; }这里的知识点是 flex 的三个属性简写flex-grow放大比例、flex-shrink缩小比例、flex-basis初始主轴尺寸。flex: 1等价于1 1 0%flex: 0 0 200px等价于不放大、不缩小、固定 200px。理解了这个笔试里变化各种flex参数的题目也能应对。另一种高频题目是“元素水平垂直居中”的实现方案。flex、grid、绝对定位 transform、margin: auto 这些都要能写出来。容易被忽略的是绝对定位 margin: auto 的方案.father { position: relative; } .child { position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width: 100px; height: 100px; }这个方案的原理是绝对定位元素在可定位区域内如果上右下左都设为 0再配合 margin: auto浏览器会自动把剩余空间均分到四个方向从而实现居中。笔试里问“不用 flex 和 grid如何实现水平垂直居中”这个方案就是标准答案之一。还有一类是 CSS 属性的细节辨析比如visibility: hidden和display: none的区别、position: sticky的生效条件、z-index在什么情况下失效。这些知识点不难但非常零碎我建议用碎片时间刷题来巩固而不是专门拿一大块时间去背。3. 手写题与算法题实战从解题思路到代码实现编程题是拉分的关键。百度笔试的编程题一般是两个层次一个偏算法通常以 LeetCode 中等题为主一个偏前端手写场景比如实现某个函数、封装某个组件逻辑。下面挑最有代表性的几类详细拆解。3.1 高频手写题防抖、节流、深拷贝、Promise防抖和节流是前端笔试的“老演员”出题概率极高。防抖的核心思想是事件触发后等待一段时间再执行如果等待期间再次触发则重新计时。节流的核心思想是一段时间内只执行一次。防抖的经典实现function debounce(fn, delay) { let timer null; return function (...args) { if (timer) clearTimeout(timer); timer setTimeout(() { fn.apply(this, args); }, delay); }; }这个实现里有两个细节要注意。第一回调函数里必须fn.apply(this, args)因为直接调用fn(args)会丢失 this 绑定在事件处理场景下 this 本来应该指向绑定事件的元素。第二timer必须保存在闭包变量里每次调用返回的新函数时都能访问到同一个 timer才能实现“重新计时”的效果。节流的实现有两种常见方式时间戳版和定时器版。时间戳版在第一次触发时立即执行但停止触发后不会再有最后一次执行定时器版在停止触发后还会执行最后一次但第一次触发会有延迟。笔试如果要求“实现一个节流函数”两种都写出来再说明区别是很好的加分项。深拷贝的坑比想象中多。面试官或笔试阅卷人想看到的实现至少要处理三种情况循环引用、特殊类型Date、RegExp、Map、Set、symbol 和不可枚举属性。一个较完整的深拷贝实现function deepClone(obj, hash new WeakMap()) { if (obj null || typeof obj ! object) return obj; if (obj instanceof Date) return new Date(obj); if (obj instanceof RegExp) return new RegExp(obj); if (hash.has(obj)) return hash.get(obj); const target new obj.constructor(); hash.set(obj, target); for (let key of Reflect.ownKeys(obj)) { target[key] deepClone(obj[key], hash); } return target; }用 WeakMap 存映射关系是为了解决循环引用——当对象里某个属性引用了自身时再次递归会无限循环而 WeakMap 在遍历时如果发现这个对象已经存过直接返回之前的克隆结果就断掉了环。Reflect.ownKeys 可以同时拿到字符串 key 和 symbol key比 Object.keys 更全面。Promise 相关的手写题一般是 Promise.all、Promise.race或者是串行执行多个异步任务。Promise.all 的实现关键点是结果顺序要和传入顺序一致不管 Promise 完成的先后顺序如何。function promiseAll(promises) { return new Promise((resolve, reject) { const result []; let count 0; for (let i 0; i promises.length; i) { Promise.resolve(promises[i]).then((value) { result[i] value; count; if (count promises.length) resolve(result); }, reject); } }); }注意这里不能直接result.push(value)因为各 Promise 完成顺序不定push 会导致结果顺序错乱。先占位再赋值才能保证顺序。3.2 算法题的典型思路算法题的范围比较广但百度笔试常见的是字符串处理、数组操作、二叉树遍历、动态规划简单题。准备时优先刷 LeetCode 的 Top 100 高频题特别是其中的简单和中等难度。举一个典型例子给定两个字符串形式的数字求它们的和禁止使用 BigInt。这道题考察的是大数相加的手算模拟。核心思路是从低位开始逐位相加记录进位最后反转结果。function addStrings(a, b) { let i a.length - 1; let j b.length - 1; let carry 0; let res []; while (i 0 || j 0 || carry) { const x i 0 ? Number(a[i--]) : 0; const y j 0 ? Number(b[j--]) : 0; const sum x y carry; res.push(sum % 10); carry Math.floor(sum / 10); } return res.reverse().join(); }这类题目的考察点不是你会不会用现成 API而是遇到超出常规类型限制的问题时能不能用基础数据结构手动模拟。这背后的能力是“逻辑分解”把大问题拆成小步骤逐步实现。前端日常工作里很需要这种能力。3.3 DOM 场景题把原生 API 用对编程题里偶尔会出现 DOM 操作场景题比如“实现一个函数把某个节点下的所有文本节点内容中包含指定关键词的部分高亮”。这类题考察原生 DOM API 的熟练程度以及递归遍历的能力。常规解法思路是先遍历所有子节点判断 nodeType如果是文本节点nodeType 3检查内容并做替换如果是元素节点继续递归遍历子节点。操作时要注意文本节点的指针移动因为替换文本内容可能会影响遍历位置。不过说实话这类题在大厂笔试里出现频率不算特别高因为线上判题系统不方便模拟真实 DOM 环境。如果出现更多是简答题形式让你描述思路而不是完整写代码。准备时重点记住 TreeWalker 或 NodeIterator 可以用来遍历 DOM以及 textContent 和 innerHTML 的区别基本够用。4. 网络、浏览器与安全笔试里的“隐形成本”JavaScript 和算法是前端笔试的显性权重但网络、浏览器、安全这块内容往往是“压垮骆驼的最后一根稻草”。很多同学编程题答得很好反而在选择题里丢了不少分。这一块知识覆盖范围广、内容庞杂如果没有系统梳理很容易被出题人设置的“陷阱选项”带走。4.1 HTTP 核心考点缓存、状态码、HTTPSHTTP 相关题目重点在缓存机制。常见的出题方式是给出几个响应头问资源的缓存策略。这里有一个容易混淆的知识点强缓存和协商缓存的区别。强缓存就是浏览器不向服务器发请求直接读本地缓存由Cache-Control和Expires控制。协商缓存是浏览器向服务器确认资源是否过期由Last-Modified/If-Modified-Since和ETag/If-None-Match控制服务器返回 304 时使用本地缓存200 时返回新资源。需要特别注意Cache-Control里的几个字段no-cache不是不缓存而是每次使用前必须向服务器验证no-store才是真正的不缓存max-age的单位是秒s-maxage只对 CDN 等共享缓存生效。这些细节在笔试里出现频率非常高也是容易记混的地方。状态码考察集中在 301、302、304、400、401、403、404、500、502、503。有个经典易错点是 301 和 302 的区别301 是永久重定向浏览器会缓存重定向结果302 是临时重定向每次都需要重新请求原地址。还有一个冷门但偶尔出现的303 是“查看其他位置”常用于表单提交后的重定向语义上区别于 307/308保持请求方法和主体不变的重定向。HTTPS 的握手流程也是选择题常客。简化版的记忆口诀是“一RSA二证书三密钥四加密”。更严谨地说TLS 握手过程大致是客户端发送支持的加密套件列表和随机数 → 服务器回复证书和随机数 → 客户端验证证书并生成预主密钥用服务器公钥加密后发送 → 服务器用私钥解密得到预主密钥双方各自计算出会话密钥 → 之后用会话密钥对称加密通信。笔试里最常问的是“HTTPS 握手中哪一步用于验证服务器身份”答案就是“客户端验证服务器证书”这一步。4.2 浏览器渲染机制重排、重绘、合成浏览器的渲染流程是前端性能优化的理论基础也是笔试常考点。完整的渲染流程是HTML 解析生成 DOM 树CSS 解析生成 CSSOM 树两者合并成渲染树Render Tree然后进行布局Layout、绘制Paint最后合成Composite。这里常见题目是“以下哪个属性修改会触发重排reflow而不是重绘repaint”。答案是修改 width、height、margin、padding、top、left 这些影响几何信息的属性会触发重排修改 color、background-color 这些不影响布局的属性只触发重绘。单纯触发重绘的开销比重排小所以性能优化的一个方向就是减少重排。出题还会延伸到requestAnimationFrame、will-change、transform/opacity为什么能触发 GPU 合成而避免重排。注意transform虽然看起来是“位移”但它不触发重排也不触发重绘而是直接进入合成阶段因为 transform 不会影响其他元素的布局也不会改变元素自身在文档流中的占位。这种“为什么”层面的理解比死记哪些属性触发重绘更重要。4.3 前端安全XSS 与 CSRF安全类题目在前端笔试里占比不大但属于“高频考点中的稳定项”。两道题必考XSS 和 CSRF 是什么、怎么防御。XSS跨站脚本攻击的核心是攻击者把恶意脚本注入到页面中执行。常见类型有三种存储型恶意脚本存在服务器数据库里比如评论区、反射型恶意脚本通过 URL 参数反射回页面、DOM 型纯前端通过 DOM 操作把恶意内容插入页面。防御的通用原则是“不信任用户输入”对外部数据做转义对 HTML 标签进行编码使用 CSP内容安全策略限制脚本来源。CSRF跨站请求伪造的核心是攻击者诱导用户在已登录的网站上执行非本意的操作比如通过一个隐藏表单自动提交请求。防御方案一般是加 CSRF Token服务器下发随机 token提交时校验、校验 Referer/Origin 请求头、设置 Cookie 的SameSite属性为Lax或Strict。笔试里直接让你选“下面哪个能防御 CSRF”你要能分辨出这三者都是正确答案的方向而“给接口加上 CORS”是错误的因为 CORS 只控制浏览器跨域请求是否被允许读取响应并不能阻止请求本身的发送。这一块容易掉分的点在于 XSS 和 CSRF 的概念混淆。我建议用一句话区分XSS 是“攻击者把脚本塞到你的页面里”CSRF 是“攻击者借用你的身份去发请求”。一个是对页面本身攻击一个是对用户身份滥用。备考时把这个区别刻在脑子里很多选择题直接秒选。5. 框架与工程化从“会用”到“说清原理”Vue 或 React 几乎是大厂前端的必问项笔试里通常以选择题或简答题形式出现。考的不是会不会写而是理不理解设计思想和底层原理。5.1 Vue 与 React 的核心差异笔试题目常见的问法是“Vue 和 React 在数据更新机制上有什么区别”。标准回答脉络是Vue 2 使用 Object.defineProperty 实现响应式Vue 3 使用 ProxyReact 默认通过 setState 触发更新需要手动配合不可变数据。Vue 的依赖收集是自动的、精确的React 需要从根组件向下协调reconciliation。但这只是第一层。真正的加分回答是能进一步说明两者设计目标的差异Vue 追求“更少的开发者心智负担”框架替你做依赖追踪React 追求“可预测的状态管理”数据流向更明确配合函数式组件和不可变数据便于做时间旅行调试。笔试简答时能说出这一层分数一般不会低。虚拟 DOM 也是必考点。问“虚拟 DOM 是什么”“key 的作用是什么”。key 的核心作用是让 diff 算法能识别哪些节点是稳定的、哪些是发生变化的。如果用数组 index 作为 key在列表顺序变化或头部插入时会导致错误的节点复用引发渲染 bug。笔试里会给出一个动态列表的场景问“下列哪种写法会有性能问题”答案就是 index 作为 key 的情况。5.2 工程化基础模块化、打包工具、性能优化webpack 相关的题目主要集中在三个层面构建流程、loader 和 plugin 的区别、常见优化手段。loader 和 plugin 的区别是高频考点。loader 本质上是文件转换器把非 JS 模块比如 CSS、图片、TypeScript转换成 webpack 能处理的模块plugin 本质上是构建生命周期钩子可以在打包的各个阶段做一些自定义操作比如压缩代码、生成 HTML 文件、提取公共代码。一句话总结loader 管“怎么处理某个文件”plugin 管“整个构建过程能做什么”。性能优化题目一般会让你分析某个页面的加载优化方案。这类题比较开放可以从网络层面CDN、HTTP 缓存、资源压缩、构建层面代码分割、tree-shaking、懒加载、渲染层面减少重排重绘、图片懒加载三个维度来作答。笔试答题时按这个框架展开不会有遗漏。5.3 手写“迷你框架”类题目怎么准备有一个比较进阶的题型是让你实现一个简版响应式系统或者实现一个迷你版 Vue 的依赖收集。这类题在笔试中属于拔高题出现了会拉高区分度。最核心的机制是“发布-订阅模式”读取数据时收集依赖订阅者修改数据时通知依赖更新发布。Vue 3 的 effect track trigger 就是这套逻辑。如果笔试时真遇到先写出最简版本再逐步补充边界情况比空着手强得多。我准备这种题时的方法是自己用 50 行代码实现一个极简的响应式类核心就三步定义 Reactive 类借助 Proxy 拦截 get 和 setget 时把当前活跃的 effect 函数收集到依赖集合里set 时遍历触发依赖集合里的所有 effect。写过一遍之后很多关于响应式的抽象概念就具象化了。6. 常见失分点与备考建议避免“题都会分不高”笔试刷题最大的挫败感来自“题目我都见过但就是做错”。我复盘了网上大量第三批笔试题讨论帖总结了几个高频失分点每一条都是血泪教训。6.1 失分点一多选题当单选题做大厂笔试题里多选题的扣分规则很严格多选、少选、错选都不得分。很多同学平时刷题只刷单选到考场上按“排除掉错误项”的思路去做多选题结果漏选了正确项。备考时要专门练习多选题而且不只是背答案要能说清楚每个选项为什么对、为什么错。一道涉及 HTTP 状态码的多选题如果四个选项分别对应 302、304、400、503你要能做到不仅判断出哪些是正确的还要解释每个状态码的语义和常见场景。这样才能避免漏选。6.2 失分点二手写题细节处理不完整手写函数的考察点不只是“功能是否实现”还有“边界情况是否处理”。比如深拷贝没处理循环引用、防抖函数没处理 this 指向、Promise.all 没处理传入空数组的情况这些都会扣分。我的建议是平时练习时不要看一眼答案就觉得会了要自己手写一遍然后对照标准实现逐行检查细节。重点检查参数类型校验、返回值类型、边界条件空数组、空对象、非法输入、this 绑定是否正确。笔试界面通常没有自动补全也没有报错提示代码只能靠“一遍写对”平时练得越严谨考场上越能保持稳定。6.3 失分点三时间分配不合理整套卷子 90 到 120 分钟建议的分配方式是单选题控制在 25 分钟内多选题 15 分钟简答和程序输出题 30 分钟编程题留足 30 分钟以上。程序输出题看起来简短但实际推导过程可能很耗时间不要恋战60 秒没有思路就先跳过把时间留给更有把握的题目。有个实用技巧是先把整份卷子的题目全部扫一遍把一眼能看出答案的题目立刻做掉标记不确定的题最后回来再推敲。这样做的好处是保证“会的题都对”不会出现“难题写完了简单题没时间做”的遗憾。6.4 针对性复习路线如果时间有限优先级建议这样排第一梯队是 JavaScript 核心原型链、this、闭包、事件循环、异步第二梯队是 HTTP 缓存与浏览器渲染、CSS 经典布局第三梯队是框架原理、工程化、安全第四梯队是算法刷题每天固定两三道保持手感。战线拉长的话我还会建议“以点带面”复习。拿到一道题不要只看正确答案要把这道题涉及的所有相关知识点都梳理一遍。比如碰到一道关于new操作符的题就顺手把new的实现原理、constructor属性、instanceof的原理一起复习了。这样刷十套真题基本等于过了一遍完整的知识体系。7. 最后一个建议像出题人一样去复习笔试复习到最后阶段我最大的感悟是与其不停刷题不如试着站到出题人的角度去思考。如果你来出这套卷子你会考哪些知识点你会在哪些地方设置陷阱这个问题想明白了复习方向就会很清楚。出题人想找的候选人不是“背过所有八股文”的人而是能够理解原理、灵活应变、在时间压力下还能保持代码质量的人。所以复习的核心始终是“理解机制”而不是“记住结论”。用我自己很喜欢的例子收尾。我刷到过一道很经典的题目问数组的sort()方法默认排序方式是什么。很多人回答“从小到大”但正确答案是“按照字符串的 Unicode 码点排序”——所以[10, 9, 100].sort()的结果是[10, 100, 9]。这道题考的不是你记没记住 sort 的规则而是你有没有“所有 API 都会有自己的设计细节”这种意识。前端各个知识点看起来零散但底层的思维方式是相通的永远不要凭感觉下结论去看规范去理解设计者的意图。下次再看到“百度2023校招Web前端研发工程师笔试卷”这类真题别急着背答案先问自己一句这道题想考察的能力是什么如果每次都能答上来你离上岸就真的不远了。
![[光学原理与应用-521]：对光的错误理解与纠偏](http://pic.xiahunao.cn/yaotu/[光学原理与应用-521]：对光的错误理解与纠偏)
