前端校招该考察什么？一个面试官的思考

前言

我是团队的一个老校招面试官，这几年陆陆续续虐过不少校招学生，遇到过很优秀聊得很开心的，遇到过让我直皱眉头的，遇到过很懂套路的，也遇到过不善表达的。讲真，面试前我还常感到紧张，我怕一个好苗子因为我的笨问题没得到充分挖掘而错过。

于是我经常在想：什么才是好问题，前端校招该考察些什么？

现又是一年校招季，想和大家分享下我的心得。

声明：

1. 我一直都是一面面试官，所以我的思考见解是针对一面的，或者说知识面；
2. 每个面试官都有自己的面试风格，比如我们团队就有一位同样负责一面的，特别喜欢问图形算法。所以你看了我的文章，觉得准备好了，结果被面试官问懵逼了，别怪我哈，我可不负责。我跟大家聊些通用部分；
3. 比我更有经验的面试官比比皆是，本文仅代表个人拙见，不足之处望大家斧正。

核心思路

校招面试和社招面试会有什么不同？我用一张图说明：

校招面试应侧重潜力考察。在前端这条路上，学习能力看你能否走得快，学习欲望看你能否走得远。

那校招时前端知识就不重要了？

也很重要。只是说实话，当你工作后学校学到的知识可能都用不上了，因为工作场景跟你自学场景关注点不同。举个例子，你在学校做前端开发，一般是单打独斗，但工作之后你就经常要跟别人合作开发，此时统一代码规范、代码要怎么组织才能减少耦合适合多人协作，就要列入考虑中。又比如，你自己做前端可能会想着怎么用新技术怎么做更酷炫，而工作业务中则关注怎么处理兼容性，怎么监控并减少脚本错误保持项目稳定等等。更别提你在学校中怎么学到如海量用户场景的开发经验？

所以对于校招生，相比不完善的前端知识积累，我们更关注潜力。前端基础是你获得面试机会的资本，而从前端知识掌握情况折射出来的潜力特质，才是你脱颖而出的亮点。

怎么考察这些虚的能力？下文将做展开。

而作为校招生的你，要思考的是怎么把自己的学习能力和学习欲望证明出来，这比简历上你写了多少行React代码有分量的多。特别是面试大公司。

面试流程

这个就百花齐放了，我自己在不断面试中总结出一套面试流程：

基本上这样一套下来，面试者的整体水平也就很清楚了。不同公司团队的一面流程不同，但上面几点都是很通用的考察点。

一般我们会面试超过一个小时，这样才能做到全面了解，也是一种负责。如果实在太差，提前结束。

接下来我会重点说说前端基础和项目经历，我会考察些什么。

前端基础

大家常说前端开发易学难精，因为前端开发涉及的知识项实在很多，下面这张经典的图应该不少人看过：

那校招学生该掌握哪些知识呢？由于我在公司里面负责讲授《Web开发基础概论》这门课，慢慢的我总结了前端开发的六项基础知识：HTML、CSS、JavaScript、移动Web开发、调试、HTTP网络知识。

这六项是我觉得校招学生的必备知识，面试时我会一一问到。如果你在这些前端基础上都表现不好，那你就只能在学习能力上特别突出才行了。

HTML

前端编程语言基础。我会考察：

1. 常用的meta头；
2. 通过你对标签语义化的理解来判断你能否写出更规范的HTML代码；
3. HTML5新增的能力；
4. HTML的渲染解析知识，比如为什么CSS放前面JS放后面，怎么理解并行加载串行执行（很有趣的一块知识，这里不做展开）；
5. ……

CSS

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

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

JavaScript

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

1. 事件模型
2. 闭包
3. 原型链

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

移动Web开发

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

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

调试

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

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

HTTP

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

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

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

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

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

可能有人会：咦咦咦，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之类，那就更好。

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

关于套路

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

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

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

结束语

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

难道是为了蹭热点？那是，现在是校招季嘛。

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

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

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

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

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