ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

2018届前端校招四家大厂面试实战复盘与经验总结

2018届前端校招四家大厂面试实战复盘与经验总结 刚整理完2018届前端校招的面试记录趁着记忆还热乎把百度、网易、搜狗、阿里四家公司的完整面试流程、题目和心得写下来。这篇文章不是单纯晒offer或者报喜而是想给准备前端校招的同学一份可以直接参考的“实战地图”——每一轮面试怎么面的、问了什么题、面试官到底想考察什么、我当时是怎么答的、哪些地方事后复盘发现答得不好。如果你现在正在准备前端面试或者刚刚开始走前端学习路线这篇文章值得你花二十分钟读完。1. 再聊2018届前端校招那年面试到底考什么1.1 时间背景为什么2018届是一个特殊的年份2018届毕业对应的秋招时间是2017年9月到10月。那一年前端圈子的技术栈和现在有明显差异Vue 2.x正处于爆发期React 16刚发布不久Webpack 3到4的过渡让工程化话题变得非常热。面试题库远没有现在这么“卷”没有微前端、没有跨端框架、没有Serverless连面试官问的问题都相对克制。但有一点和现在完全一致基础永远是大头手写代码永远绕不开。那一年还有一个特殊背景移动端H5开发需求爆发hybrid架构在各家大厂已经落地所以面试中“移动端适配”“浏览器渲染机制”“HTTP缓存”几乎是必考题。另外2017年也是“前端工程化”从概念走向标配的一年webpack的loader、plugin区别几乎是所有大厂二面的必问题。1.2 备战阶段我是怎么准备简历和知识体系的我的备战时间线大概是提前三个月开始。七月份先过基础JavaScript核心闭包、原型链、作用域、this指向、浏览器原理渲染流程、事件循环、垃圾回收、HTTP与网络基础缓存、跨域、HTTPS握手、CSS布局flex、居中、BFC。八月开始投递简历和内推同时刷LeetCode高频题和前端手写题。简历方面我准备了两页第一页写教育背景、技术栈、实习经历和项目经历第二页附上GitHub和博客链接。现在回头看2018届的简历筛选对“实习经历”非常看重有实习经历的同学拿到面试机会的概率高很多。如果当时没有实习项目经历就要写得足够扎实每个项目要能讲清楚背景、技术选型、核心难点、最终效果并且能应对面试官随后的连环追问。2. 百度三轮技术面加一轮HR面主观设计题才是分水岭2.1 百度面试流程与一面基础题复盘百度的流程是内推、笔试或者部分岗位免笔试、三轮技术面加一轮HR面。我当时是8月底通过学长内推投递9月初收到面试通知面试地点在西二旗的百度科技园。整个流程一天内走完三轮技术面节奏非常紧凑。一面面试官比较年轻上来先让自我介绍然后直接问我“项目里遇到最难的问题是什么”这是几乎所有大厂一面的固定开场表面在聊项目实际是在考察你的技术深度和表达能力。我当时讲的是H5页面在低端安卓机上的内存优化问题面试官顺着追问了浏览器垃圾回收机制和内存泄漏的常见场景。随后进入手写代码环节。我记得很清楚一面一共考了四道题手写new操作符并解释new的过程中发生了什么手写防抖函数和节流函数并说明两者适用场景的区别考察变量提升与事件循环给出代码输出执行顺序利用原型链实现一个简单的继承这四道题都是2018年前端面试八股文里的高频题没有偏题怪题。但如果你只是背结论不深入理解原理面试官一追问就会露馅。比如手写new的时候面试官会继续问“如果构造函数返回了一个对象new的结果是什么”这就是考察你是否真的理解了new的完整过程。2.2 百度二面Vue原理与工程化深挖二面开始进入框架和工程化领域。面试官问的第一个问题是“Vue 2的响应式原理是怎么实现的”这个问题在2017年几乎是必考题答案核心是Object.defineProperty。我当时的回答思路是数据对象通过Object.defineProperty进行属性劫持每个属性有一个Dep依赖收集器组件渲染时通过Watcher订阅依赖数据变化时触发setter通知Watcher更新视图。面试官听完没有停继续追问了几个很容易卡壳的问题Object.defineProperty有什么缺陷数组的响应式是怎么处理的Vue中给对象新增属性为什么不是响应式的怎么解决computed和watch的实现差异数组响应式这块如果只看文档没看源码很容易答不上来。我当时答的是Vue 2通过重写数组的七个方法push、pop、shift、unshift、splice、sort、reverse来实现数组的响应式监听而没有通过defineProperty对数组的每一项进行劫持因为数组长度可能非常长性能消耗太大。新增属性用Vue.set解决。接着问webpackloader和plugin有什么区别我当时答loader是文件加载器负责将不同类型的文件转换成模块plugin是插件系统可以监听webpack构建生命周期在特定时机执行自定义逻辑。但面试官接着问“如果让你写一个loader你会怎么写”这个就要求对loader的API有一定的了解。我是从loader是导出一个函数的模块、接收source参数、返回处理后的结果这个角度回答的。2.3 百度三面主管面与开放式设计题三面是主管面没有问太多具体技术只问了一道开放式设计题“如果让你设计一个前端错误上报系统你会怎么设计”这道题我印象非常深刻因为它没有标准答案考察的是需求拆解能力和方案取舍能力。我当时的回答是分四步第一步确定上报内容包括错误类型、错误信息、发生时间、页面URL、用户设备信息第二步确定上报方式用动态创建Image标签的方式发送GET请求而不是用XMLHttpRequest因为Image请求没有跨域限制且不影响页面主流程第三步设计批量上报策略将错误信息暂存在内存队列中达到一定数量或者页面卸载前统一上报第四步增加错误去重和服务端日志检索接口。面试官一路引导追问“如果用户断网了错误信息丢失怎么办”“上报请求本身失败了怎么办”这些问题实际在考边界情况的处理。我当时答了使用localStorage做本地缓存网络恢复后补报以及navigator.sendBeacon在页面卸载时发送数据的方案。这轮面试虽然难但很能考验平时的知识积累和思维习惯。HR面在这个流程之后问了一些常规问题是否接受加班、对百度的了解、职业规划、手里还有其他offer吗。整体感觉百度HR面相对轻松主要看你的意愿和稳定性。3. 网易从笔试到HR面基础题一题都不能错3.1 网易在线笔试题量大时间紧细节点多网易的校招流程比较规范在线笔试、技术面两轮到三轮、HR面。2017年网易的笔试是在一个周末统一进行的题目类型分为三块选择题、编程题和问答题。选择题覆盖面很广前端基础、操作系统、网络、智力题都有其中最让人头疼的是一些非常细节的题目。我挑几个印象深的CSS中display:none和visibility:hidden的区别这个简单给定HTML结构判断CSS选择器的优先级顺序localStorage的存储容量上限是多少JavaScript中0.10.2为什么不等于0.3怎么解决这些题每年都会出现看起来不难但容易在细节上翻车。比如localStorage容量上限标准答案通常是5MB左右但每个浏览器实现略有差异如果没实际测过只能凭印象猜。0.10.2的问题除了说明二进制浮点数精度问题最好还能给出toFixed或者转化为整数运算的解决方案。编程题一般有三道难度属于LeetCode中等偏下数组去重、字符串处理、二维数组查找。但要注意的是在线笔试的编程题不能跳出去查API平时写代码不脱离IDE的同学需要提前适应这种裸写环境。3.2 网易技术面面试官很温和但问题非常细网易的技术面风格和百度完全不同面试官很温和不会故意施压但问题考察得特别细致。一面开场也是自我介绍加项目然后问题就一个接一个来了HTTP状态码301和302的区别是什么强缓存和协商缓存分别是怎么工作的HTTP头字段有哪些浏览器从输入URL到页面显示中间发生了什么TCP三次握手为什么需要三次页面加载白屏时间过长怎么排查这些问题本身不偏但网易面试官喜欢往细节里问。比如缓存问题不仅要说出Cache-Control和ETag还要能说明浏览器是怎么判断缓存是否过期、服务端返回304时浏览器怎么处理。又比如TCP三次握手为什么要三次而不是两次如果只回答了“确认双方收发能力”还要能补充“防止历史重复连接初始化造成混乱”这层理解。二面问了一道有意思的设计题“如果页面首屏加载很慢你怎么定位问题并给出优化方案。”我当时从网络请求、资源体积、渲染性能三个维度分析提到减少HTTP请求、开启CDN、图片懒加载、JavaScript代码分割、使用SSR或者预渲染等。面试官顺着问了一个当时非常新的话题“你怎么看待前端性能优化的边界——哪些优化应该在前端做哪些应该在服务端做”这个问题的核心是要你理解前后端协作的边界而不是一味在前端堆优化手段。3.3 网易HR面和其他需要注意的细节网易的HR面安排在技术面之后问的问题比较直接期望薪资多少、能不能接受去杭州工作、手上还有其他offer吗、对网易游戏怎么看。这里有两个细节值得注意第一期望薪资不要随口报一个数提前查一下行业水平结合城市消费水平来回答第二对于“为什么选择网易”建议提前调研一下目标部门的产品面试时提到具体产品会让HR觉得你是认真准备的。网易的整体面试压力在四家公司里算最小的但这不代表可以通过。网易考察的题目虽然不难但覆盖范围特别广任何一块基础薄弱都可能被问倒。我的经验是把前端面试八股文里所有基础类题目全部过一遍确保没有死角再去网易面试。4. 搜狗算法题比例最高要敢写暴力解再说优化4.1 搜狗一面聊完基础直接上算法搜狗面试地点在五道口的搜狐网络大厦流程是两轮技术面加一轮HR面。有一说一搜狗是我面试的四家公司里算法题比例最高的这跟搜狗做搜索、输入法等产品技术栈有关系面试官对编码能力的要求非常高。一面先快速聊了JavaScript基础继承的几种方式、作用域链、闭包的应用场景、正则表达式常用方法。大概聊到第十分钟面试官就说“我们做几道题吧。”然后直接书面出了三道题写一个函数实现字符串反转给定两个数组返回它们的交集要求去重用JavaScript实现两个大数相加这三道题看起来都很基础但面试官的要求是一边写代码一边讲解思路并且写完要能说出时间复杂度和空间复杂度。大数相加那道题如果不用BigInt需要模拟竖式加法从最低位开始逐位相加注意进位。这道题很考验基本功因为一旦数组下标没处理好很容易出现边界错误。4.2 搜狗二面算法难度上升考察现场思考能力二面的算法题难度明显提升。我记得有一道是二叉树层序遍历要求按层输出每一层一个数组。常规做法是用队列配合levelSize记录每层节点数。面试官看我写完又问了一个变体如果要求从底向上按层输出呢其实就是加一个unshift或者最后reverse一下。另一道题是手写LRU缓存淘汰算法。这道题在2017年的前端面试里非常少见我当时愣了一下面试官很友善地提示“可以从Map的插入顺序特性入手”。我顺着提示写了一个基于Map的实现get时将读取的key先删除再重新set保证最近访问的key在末尾达到容量上限时删除最前面的key。这道题让我意识到搜狗面试官更看重你面对陌生问题时的思考过程和编码能力而不是期待你背过所有题目。4.3 针对搜狗这类公司算法题应该怎么准备如果你目标是搜狗或者其他对算法要求高的公司我的建议是LeetCode高频题刷两遍重点覆盖数组、字符串、链表、二叉树、栈、队列、动态规划基础练习“先讲思路再写代码”的习惯每道题拿到手先给出暴力解再分析能不能优化注意代码规范变量命名清晰、边界条件处理完整、写完主动跑几个测试用例准备一些常见变体题比如层序遍历的变体、数组去重的多解法、字符串反转的多解法面试中如果遇到没做过的题不要慌先说暴力解然后逐步优化。搜狗面试官很吃这一套他们更关注你的思考路径是否清晰而不是答案是否完美。5. 阿里连环深挖式追问每一轮都在考察原理边界5.1 阿里一面电话面从简历项目发起连环追问细节阿里的面试流程是简历筛选、电话面或者视频面、现场技术面三轮、HR面。整体流程跨度比较长每一轮面试都有一定淘汰率而且面试官喜欢连环深挖一个问题套一个问题直到你答不出来为止。我的一面是电话面持续了大概四十分钟。面试官先让我挑选一个最有代表性的项目讲然后追问的密度非常高项目里跨域是怎么解决的JSONP和CORS的区别CORS的预检请求是怎么触发的哪些类型的请求不会触发预检如果服务端没有返回正确的CORS头浏览器会怎么处理HTTPS的握手过程是怎样的对称加密和非对称加密在握手过程中各起到什么作用电话面比现场面更难的一点是没有纸笔不能画图全靠嘴说。如果对知识没有形成体系化的理解很容易讲着讲着就乱了。我的建议是准备电话面之前把所有知识点用自己的话口头复述一遍确保能够流畅地讲出来。5.2 阿里现场面手写Promise、事件循环、柯里化一个不少现场面一共三轮节奏很紧凑。第一轮从一道算法题开始给定一个整数数组找出其中两个数相加等于目标值返回下标。这道题LeetCode第一题但面试官要求用双指针或者哈希表实现并且分析两种方案的空间复杂度差异。写完算法题后就开始深挖JavaScript描述事件循环机制macro task和micro task的执行顺序给段代码让写出输出结果手写Promise至少要实现resolve、reject、then、catch方法手写柯里化函数curry讲解this在不同调用方式下的指向手写Promise那题我写了一个简化版本Promise有三个状态pending、fulfilled、rejectedthen方法将回调推入队列状态改变时依次执行。面试官追问“如果then里面返回了一个新的Promise你是如何处理的”这个问题涉及Promise链式调用的核心我当时答得不够好只是说需要递归处理返回值但没有展开具体实现。这面结束之后我立刻复盘把Promise A规范完整读了一遍补上了这个短板。第二轮现场面主要问Vue原理和项目细节模板编译的流程是什么render函数是怎么生成的虚拟DOM的diff算法及时间复杂度computed和watch的区别nextTick的原理是什么项目里使用过哪些性能优化手段如果让你设计一个组件库你会怎么设计这些问题在2018届前端面经里反复出现但阿里的特点是会一直追问到“你确实不会”为止。比如diff算法面试官会继续问“key的作用是什么为什么不能用index作为key”这就需要不仅了解diff算法还要理解列表渲染时的复用策略。第三轮是主管面风格相对宏观问的是技术选型、职业规划、团队协作、对前端的理解这些问题。这轮更多考察候选人的综合素质、思维方式和沟通能力不再纠结具体技术细节。5.3 阿里HR面价值观匹配度与一票否决权阿里的HR面是出了名的重要HR有一票否决权。我当时被问到的问题包括大学期间遇到过最大的困难是什么怎么解决的团队合作中有没有出现过意见分歧你是怎么处理的为什么想加入阿里巴巴未来三到五年的职业规划是什么期望的工作节奏是什么样的这些问题没有标准答案但有一点很关键回答要真诚、具体有真实的案例支撑。比如“最大的困难”这个问题如果你说的是“期末考试复习压力大”HR大概率会觉得没有说服力如果你说的是一个具体的技术难题或者团队矛盾并且能清晰讲出当时的分析、行动和结果HR就会认为你有解决问题的能力和韧性。阿里HR面还有一个特点会在面试中提到工作地点、是否接受异地、是否接受部门调剂。这些信息建议提前想清楚不要面试时给一个模糊的回答反而显得你目标不明确。6. 校招复盘踩过的坑与可复用的经验6.1 那些让面试加分的细节以及我踩过的坑四家公司面下来我总结了一些加分细节和反面教材。加分细节方面写代码前先口头确认思路一句话说出方案再动手面试官会觉得你有工程习惯被问到一个不会的问题时不直接说不会而是说出自己理解到的部分并且尝试拆解问题态度很重要每轮面试结尾面试官问“你有什么想问我的”准备两个高质量问题比如团队技术栈、当前面临的技术挑战这能体现你的主动性。踩过的坑也有不少。第一简历上写了“熟悉”但是没有深入准备的领域面试官追问时答不上来反而扣分。比如我在简历里写了“熟悉Web安全”实际只是了解XSS和CSRF的概念面试官追问DOM型XSS和反射型XSS的区别时我只能靠猜。后来我把简历上所有技能点都过了一遍确保每一项都能讲出至少三个层面的内容才敢自信地写在简历上。第二面试前一定要了解目标公司近期在做的事情。我去网易面试之前只是大概知道网易有游戏和邮箱业务但面试官问到“你觉得网易邮箱前端可以怎么优化”时我完全没准备回答得很空。这提醒我面经不只是背题还要结合公司的业务场景去设想问题。6.2 四家公司面试风格对比与时间线建议整理了一个表格方便大家对比公司面试轮次考察风格手写代码比例压力程度百度三面技术一面HR主管主导重设计题与方案能力中中网易笔试两轮技术HR按部就班基础覆盖广题目不偏中低低搜狗两轮技术HR算法题比例高看重编码能力与思考过程高中高阿里电话面三轮现场HR连环深挖原理考察知识边界与综合能力高高时间线方面我的建议是7月到8月初集中过基础同时刷LeetCode和前端手写题8月中下旬开始投递提前批和内推大厂提前批通常免笔试或者直接进入面试环节9月是正式批笔面试高峰期尽量把节奏拉开不要一天面两家10月是补录和offer选择阶段。战线很长注意保持体力和心态。6.3 2018届面经对现在准备前端面试的同学还有参考价值吗这个问题我最近被很多学弟学妹问过。我的看法是基础部分完全有参考价值甚至可以说是基本功中不过时的部分。闭包、原型链、事件循环、HTTP缓存、手写Promise和防抖节流这些在2026年依然会是前端面试的高频题。但面试范围确实扩展了很多现在的面试还会涉及微前端、跨端方案、性能监控、工程化体系、组件库设计、AI辅助开发等新话题这些在2018年基本没有被考察过。所以我的建议是不要把2018届面经当成完整的题库而是把它当成“基础能力清单”。上面提到的所有基础题你必须达到不看答案也能流畅回答的程度然后在这个基础上再去学习新知识、准备新题目。面试考察的本质永远不是你会背多少道题而是你的知识体系是否完整、遇到问题是否有思路、以及能不能清楚地表达出来。7. 给你的最后一句话面试不是考试是双向选择每次面试完我都会立刻做一次复盘把没答上来的问题记下来回家查资料弄懂再整理成自己的知识文档。四家公司面完我已经攒了一份几十页的手写笔记后来这个笔记变成了我整理前端面试题的重要素材。这个方法我用了六年到现在依然有效。最后再分享一个心得面试的时候不要把自己放在“被挑选”的位置上。面试官在考察你你也在考察公司——团队氛围、技术栈、业务方向、面试官的水平都在透露这家公司是否适合你。双向选择的心态会让你在面试中更松弛而松弛的状态往往能让你发挥出更好的水平。祝每个正在准备前端校招的你都能拿到心仪的offer。
返回列表