5年腾讯技术官告诉你前端校招面试该怎么准备？

本文链接：https://blog.csdn.net/m0_61068088/article/details/136814414

前端编程语言基础。像CSS Expression这种古董不做考察，IE6、IE7这种被时代抛弃的浏览器考察怎么兼容它们有啥意义。我会考察：

怎样写出更好的CSS，如层级不宜过深，如何时用ID和何时用class，如怎么拆分组织CSS代码等；
盒模型；
非常常用的CSS3知识，比如CSS3动画，比如弹性布局；
……

JavaScript

前端最重要编程语言。这一块相信大家很轻松可以找到很多面试题，或者必背JS知识列表。这一块我会考察 原生JavaScript知识，它是一切框架插件的基础。我依然会问

事件模型
闭包
原型链

等前端基础知识，不过我会从单点逐渐深入不断拓展或者结合具体案例，看你是否真正的理解掌握。如果表现不错我有时还会问浏览器的解析渲染原理，作为一个加分项吧（DOM树、渲染树、重排重绘、分层渲染、为什么DOM操作过多会影响性能等）。

移动Web开发

我说现在移动Web开发是前端开发领域的热点，应该没人反驳吧？现如今移动应用层出不穷，移动Web开发知识变得越发重要。如果你不懂移动Web开发知识，真的是落后于时代。我会考察：

移动Web开发和PC Web开发有何不同？此题考察你对移动Web开发的整体理解，同时看你能否有组织有条理地思考问题；
怎么实现响应式布局？考察你是否了解常见的布局方案；
移动端的手势和事件；
怎么提高移动端页面的渲染性能？针对移动端网络，考察你是否能从减少HTTP请求出发提出解决方案，是否了解GPU渲染（偏进阶）等；
……

调试

开发中总免不了有bug，页面运行环境总比想象中复杂，此时能否通过调试找到问题原因自主解决，非常重要。我会考察：

是否会使用基本的抓包工具、调试控制台；
怎么从茫茫网络内容中找到有用信息；
移动端如何调试；
……

HTTP

如果你连抓包知识都不会你谈何调试？如果你连304的含义都不知道，你都想不通代码修改后为什么页面还是老样子？前端开发本来就要跟网络打交道。这一块我会考察：

常见HTTP状态码；
不同请求类型的区别；
有什么缓存方案以及怎么实现；
……

上面就是前端六项基础知识。实际面试的时候我也会问一些综合问题，比如：

用户从输入url到最终页面展示，这个过程中发生了什么？
老板反馈页面打开白屏，而你手机上是正常的，怎么办？
我页面上有个动画一卡一卡的性能不行，怎么优化？
……

这些基本上就是我考察前端基础知识会问的问题。

可能有人会：咦咦咦，XSS、CSRF这些web安全相关的呢？面试社招生我会问，但是校招学生又有几个真的有遇到这样的场景，考察除了考背诵又有多大意义？

有人会：咦咦咦，怎么不说跨域呢？同理，跨域在业务项目中前端和cgi域名分离或跨业务调用会用到，但是没必要要求在校学生都要遇到过这样的场景吧？

咦咦咦，那React、Vue这些总该问了吧，我这些都掌握得非常6呢？确实，我发现近两年有些面试者React这些掌握得很好，说起来一套一套的，但他们原生JavaScript真的掌握扎实了吗？我一直坚信，只要原生JavaScript知识掌握扎实，学习一个框架是很快的，而且不管以后流行框架怎么变化，你都心里不虚。所以React、Vue这些是加分的，不是必备的。

项目经历

我常在面试前花20分钟，打开面试者简历上写的Github、博客去看看。所以你如果只是意思一下写在简历上而实际上都没怎么打理，那你还不如不写。我会根据面试者Github、博客的内容做些针对性的提问。前面环节你可以说你刚好不懂某块知识，但你自己写的你总该掌握吧？我总可以问深入了吧？

面试时我也会根据简历上的项目经历，询问面试者具体的项目细节。你是不是只会按图索骥简单用用框架？你是不是打了一箱酱油然后在项目中顺便挂个名？这些我会不断考察出来，如果是，扣分。然后我会对你项目中用到的技术栈做深入考察，你自己做项目用到的知识，你总该掌握了吧？我总可以问深入了吧？

项目经历除了考察知识，我也会考察通用素质。所以我常问一些开放问题：哪个项目是你觉得最满意的，为什么？你有没有遇到过某个大难题，最后是怎么解决？这时候你就应该把握机会把你比较突出的能力表现出来，比如坚持不懈攻克难题、比如……算了，说多了你就学会套路了。

团队协作能力也是项目经历中可以体现出来的，面试官可能在你的陈述过程对你默默做出评价：这个人看来不太合群，趁早把他淘汰好了。

其他小点

上面就是我对校招面试流程和该考察什么问题的理解，也是我几年面试经验的沉淀吧。这一小节我回答些大家可能有的疑惑：

前端校招要不要考察算法？

印象中很多公司团队都有问算法问题，比如怎么实现快排，我们团队别的面试官有时也会问。个人觉得考算法还不如考察前端基础知识，算法在前端领域用的真没有其他开发领域多，我做了几年业务开发也真没用到复杂算法。校招时问算法，更多是在考核你大学专业知识的掌握程度，你的学习能力如何。所以我基本不问，考前端基础知识同样可以看出学习能力。除非你的前端基础真的比较差，我才会考察算法。

有人可能会说，以后做复杂系统做高性能框架这些都要求算法水平高啊。是的，我承认，但这不是前端校招生现在必须掌握的能力。他们只要学习能力强，还怕以后没法把算法知识补上来？

前端校招要不要考察设计模式？

公司一位同事写了一本《JavaScript设计模式与开发实践》，豆瓣9.1，挺不错的书。学好设计模式，对你写出结构更清晰，维护更方便的项目代码是很有帮助的。校招时可以考察，不过直接问你会哪些设计模式就有点过了，因为有时候我们实际已经用了某个设计模式的思路组织代码，我们只是不知道它的名称，那不就中招了？考术语是很偷懒的做法，更好的做法是给出一个实际场景问题，看对方能否用设计模式的思路解决。

校招学生应该偏技术深度还是技术广度？

当年我参加百度校招，百度的一个总监说：“在学校应该以知识广度为主，工作后应该选择某个技术方向深挖，当你某一天到了瓶颈，那你又是时候广度发展了。”深以为然。

所以我会更喜欢具有广度知识的学生。举个例子，上面提到的一个综合问题：用户从输入url到最终页面展示，这个过程中发生了什么？有些学生计算机网络课程学的不错，能从HTTP请求组包、网络模型、DNS解析、建立连接这些方面跟我讲深里面的细节，这是深度知识，也是不错的。不过我更喜欢听到这样的答案：

用户输入url，到浏览器缓存机制检查，到HTTP请求包结构，到DNS解析，到连接建立，到服务器端处理（如动态页面处理、静态页面返回，CDN相关知识），到浏览器收到HTML内容怎么解析，到怎么并行加载串行执行CSS、JS，到怎么构造渲染树渲染页面，到怎么根据请求头把内容缓存到浏览器端。如果此时你还能补充HTTPS、同构直出、Service Worker之类，那就更好。

这就是知识的广度，将知识组织成一个整体的架构。即使你回答的时候对一些细节讲不清楚，我也觉得比只知道单点并讲深的同学得分高。

关于套路

照我所知，有些大学计算机社团有着优良的传统：师兄师姐总结出完善的前端面试知识常问问题必备知识。然后师弟师妹就可以按图索骥，背背背或学学学。

我是做了一段时间的一面面试官才看到这样的清单，当时都呆了。于是后来我开始反套路了。如果一个校招面试者对我问的前端基础知识回答溜得飞起不打一个停顿，我就会开始根据一个知识点，深入一层问问，或者再深入一层，压力面，问到对方回答不出。此时到底是真正掌握这个知识还是单纯靠背，就能看出来了。或者直接就从场景切入，而不是直接问请介绍前端缓存这样的问题。

当然了，套路不是不好。我觉得，能真正掌握知识 > 靠背诵掌握知识 > 连基础知识都回答不好。你连这些知识都懒得记，那我也懒得放你过。

结束语

啰嗦了这么多，我写这篇文章到底是想干嘛？

难道是为了蹭热点？那是，马上就到金三银四招聘季嘛。

是为了告诉大家面试官怎么出题，让大家学会一些对付面试官的套路？呵呵，那我要和你说，我们已经有意识地反套路了，如果你说你懂得某一个知识，却被发现只是非常基础的掠过，给我们感觉是更差的。

写这篇文章还是想让大家趁还有些时间，对照着整理自己的知识体系，查漏补缺，有针对性的学习前端知识。

写这篇文章还是想让大家体会下面试官视角，对面试怎么进行有个心理准备，减少因为紧张之类的因素导致没有正常发挥。

写这篇文章也想跟其他校招面试官一起交流观点。我觉得没必要把这些当做秘密捂住，重要的不是问题，而是面试者能给出什么样的答案。

最后你可以祈祷：面试腾讯的时候不要遇到我。

下面分享一份我无意中在GitHub上刷到的一份《前端校招面试题精编解析大全》，已经标星8.3K了，仔细看了下，解析还不错，秉着好东西就要分享的原则，同时也希望大家在今年的金三银四中找到满意的工作，下面分享给大家。

HTML

浏览器页面有哪三层构成，分别是什么，作用是什么?
HTML5的优点与缺点？
Doctype作用? 严格模式与混杂模式如何区分？它们有何意义?
HTML5有哪些新特性、移除了哪些元素？
你做的网页在哪些浏览器测试过,这些浏览器的内核分别是什么?
每个HTML文件里开头都有个很重要的东西，Doctype，知道这是干什么的吗？
说说你对HTML5认识?（是什么,为什么）
对WEB标准以及W3C的理解与认识?
…

CSS

解释一下CSS的盒子模型？
请你说说CSS选择器的类型有哪些，并举几个例子说明其用法？
请你说说CSS有什么特殊性?（优先级、计算特殊值）
常见浏览器兼容性问题与解决方案？
列出display的值并说明他们的作用？
如何居中div, 如何居中一个浮动元素?
请列举几种清除浮动的方法(至少两种)?
block，inline和inlinke-block细节对比？
什么叫优雅降级和渐进增强？
说说浮动元素会引起的问题和你的解决办法
你有哪些性能优化的方法？
…

JavaScript

js的各种位置，比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop, offsetTop,clientTop的区别？
js拖拽功能的实现
异步加载js的方法
js的防抖与节流
说一下闭包
说说你对作用域链的理解
JavaScript原型，原型链 ? 有什么特点？
请解释什么是事件委托/事件代理
Javascript如何实现继承？
函数执行改变this
babel编译原理
函数柯里化
说一下类的创建和继承
说说前端中的事件流

小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。

深知大多数初中级前端工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！
因此收集整理了一份《2024年Web前端开发全套学习资料》送给大家，初衷也很简单，就是希望能够帮助到想自学提升又不知道该从何学起的朋友，同时减轻大家的负担。

由于文件比较大，这里只是将部分目录截图出来，每个节点里面都包含大厂面经、学习笔记、源码讲义、实战项目、讲解视频

如果你觉得这些内容对你有帮助，可以添加下面V无偿领取！（备注：前端）

最后

javascript是前端必要掌握的真正算得上是编程语言的语言，学会灵活运用javascript，将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识，而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的，直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后，发现暂时没有提升的空间，我们可以暂时放一放。继续下面的学习，javascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。

开源分享：【大厂前端面试题解析+核心总结学习笔记+真实项目实战+最新讲解视频】

css源码pdf

JavaScript知识点
活运用javascript，将对以后学习工作有非常大的帮助。掌握它最重要的首先是学习好基础知识，而后通过不断的实战来提升我们的编程技巧和逻辑思维。这一块学习是持续的，直到我们真正掌握它并且能够灵活运用它。如果最开始学习一两遍之后，发现暂时没有提升的空间，我们可以暂时放一放。继续下面的学习，javascript贯穿我们前端工作中，在之后的学习实现里也会遇到和锻炼到。真正学习起来并不难理解，关键是灵活运用。