作为web前端工程师，我们一定要明白一场面试绝不是单纯考察技术而已，而是对前端工程师综合能力的判定与考察。关于面试的细节，如知识怎么复习？问题如何回答？项目怎么准备？和负责人如何沟通？如何加深HR对自己的印象等……千万别小瞧这些问题，要知道细节决定成败，只有未雨绸缪的人才能轻松自若的应对层层面试。

今天小编主要从准备、约面、面试、面试总结这四个部分，来传授大家如何准备前端面试。

准备篇：

一、准备面试简历：

常规内容：

· 个人基本信息：如姓名、年龄、手机、邮箱等

· 学历说明：填写自己的最高学历，如果是211/985不要忘了打上名校标签，留学经历也要着重注明。

· 工作经历：包括工作时间、公司、岗位、职责、技术栈、突出业绩等。

· 对工作理解和掌握情况：说明每个技能点是了解、熟悉、熟练使用、还是精通的水平。精准定位应聘岗位任职要求。

· 其他：技术博客、开源项目，GitHub等（如果你有写博客的习惯，放上你的博客地址，是非常不错的加分项）

个人发挥：

根据面试进度把握面试的沟通方向，豁达、自信的适度发挥。

二、刷面试题：

· 前端面试常见知识点整理

· 经典面试题重温

· 应聘公司以往面试题针对性复习

· 以往面试经验总结回顾（看看自己之前遇到过那些坑，吸取经验）

三、调整好心态

过度自信和极度自卑都不会给面试带来好的结果，只有明确自己的目标并积极备战，才能距离offer更近一步。

四、温馨提示：

切忌在简历上自己给自己挖坑，制造面试障碍。通常来说面试官一般会按照简历中提到的技能去提问，所以表达技能的时候用词要恰当。

约面篇：

一、保持通信顺畅：

这一点往往被很多人忽视，其实保持通信的顺畅是很重要的一点，直接会影响你会不会失去一次面试的机会。因为联系你大多都会直接通过简历上的电话。如果面试官想通知你参加面试，而你的电话总是处理关机或者无法接通的情景之下，可想而知，你将会失去这样的一次机会，而这样的一次机会或许就是改变你命运的一次机会。

二、按时赴约、避免迟到：

有的时候面试会安排在早上，对于车程较远的面试者可能会因为睡过头、堵车等一系列原因未能准时赴约。这会给HR留下非常不好的印象，而且很多公司的面试会安排的非常密集，迟到的严重后果就是很有可能会导致自己失去一次面试的机会。

三、明确自己的任职要求：

分析与职位描述是否十分匹配，优势是否突出。

面试篇：

一、前端面试常见问题罗列（不完全版本，后期不断更新）

1、在制作一个Web应用或Web站点的过程中，你是如何考虑它的UI、安全性、高性能、SEO、可维护性以及技术因素的？

2、谈谈你喜欢的开发环境。(例如操作系统，编辑器，浏览器，工具等等。)

3、你最熟悉哪一套版本控制系统？

4、描述一下当你制作一个网页的工作流程吗？（流程参考）

· 1）根据需求，确定主题。透彻深入所做网站的核心功能和关键。

· 2）收集资料。从对比相同类型的网站（惯用而熟悉的样式，用户更乐意接受），参照别人可行的实现方法。

· 3）规划网站。抽离出类似的模块和可重用的部件。如果是响应式网站就需要设定断点，根据不同宽度屏幕设定样式。

· 4）设计数据库。

· 5）搭建基本的框架。

· 6）编码和调试。注意统一命名和编码规范。当多人开发时，还需要制定规范文档。

· 7）上传测试。网站上传以后，你要在浏览器中打开自己的网站，逐页逐个链接的进行测试，发现问题，及时修改，然后再上传测试。

· 8）维护更新 。网站要注意经常维护更新内容，保持内容的新鲜，不要一做好就放在那儿不变了，只有不断地给它补充新的内容，才能够吸引住浏览者。

5、你能描述一下渐进增强和优雅降级之间的不同吗?

6、假若你有5个不同的 CSS 文件, 加载进页面的最好方式是?

7、你如何对网站的文件和资源进行优化？

8、为什么利用多个域名来提供网站资源会更有效？

9、请说出三种减少页面加载时间的方法。（加载时间指感知的时间或者实际加载时间）

10、你都使用哪些工具来测试代码的性能？

11、如果打算熟练掌握一项新技术或者编程语言，会选什么，解释一下原因？

12、浏览器标准模式和怪异模式之间的区别是什么？

13、如果网页内容需要支持多语言，你会怎么做？

14、列举不同的清除浮动的技巧，并指出它们各自适用的使用场景。

15、你最喜欢的图片替换方法是什么，你如何选择使用。

16、如何为有功能限制的浏览器提供网页？

17、在书写高效 CSS 时会有哪些问题需要考虑？

18、使用 CSS 预处理器的优缺点有哪些？

19、解释一下你对盒模型的理解，以及如何在 CSS 中告诉浏览器使用不同的盒模型来渲染你的布局。

20、为什么响应式设计和自适应设计不同？

二、展现软实力

人无完人，每个人都有自己好的一面和不足的一面，在面试的时候，应该尽可能展示自己优秀的一面。举个例子，对于校招生或实习生而言，面试官真的不太在乎你所掌握的技术如何，而更再意的是你是不是有发展的潜力。处事能力、学习能力，解决问题的能力等等。而这些信息都是HR在你的言谈举止中捕捉的，所以你应该借面试机会，向面试官展示你简历上未曾体现的软实力。

面试总结篇

即使面试失败了也不要气馁，而是要从失败的经历中总结经验，要知道每一次的面试失败都是你下一次面试成功的铺垫。不妨从以下几个方向审问自己：

· 技术：技术方面缺少什么？面试官看重的是什么？

· 软实力：自己拿分项是哪些？自己丢分项是哪些？自己面试过程的沟通能力如何？

· 失败原因：面试失败原因是什么？是由于技术不足？还是其他原因造成自己面试失败？

当然，还可以去思考更多为什么？…

前端本身就是一个美好有趣的领域。对于众多的网站或者系统来说，后台提供的功能才是核心模块，但是关乎网站或者系统是否能够持续地吸引用户的眼球，能否在同样类型的产品中脱颖而出，也许前端的交互是否人性化和性能是否稳定高效占了绝大多数因素。

前端知识多而细碎，需要我们通过系统的学习不断进步。获取更多前端干货，如学习线路图、视频教程、入门书籍、学习工具、面试题等，欢迎大家持续关注我们的头条号哇~