前端面试总结及建议

最近，由于项目组刚成立不久，团队处于天地初开的混沌状态，人员配置不齐，急需一大股新鲜血液融入，为此，开启了一段时间与求职面试者的博弈之路！

如今的IT大环境，似乎每个公司一年四季都处于招人状态，而同时又有一大批无论是离职还是在职人员期许找一个环境待遇更佳的公司入职；如此的供需关系不应该很和谐吗，为何在当下看来如此的矛盾呢？经过这些天和面试者交流之后，在心中渐渐还是有了些许答案；在此，我主要就自己所能看到一些问题做下总结，以及给更多的WEB前端面试者一些建议（很感谢面试一起交流过，还有给我反馈意见的同行）。

（1）现场面试和电话面试

这里建议有条件做现场面试的，一定最好去现场面试，这样最能看到一个公司的环境以及同事之间的氛围，毕竟一旦决定去上班，这些都是息息相关的；

再者，电话面试由于面试官和求职者只能语音，相对来说，比现场要更加放松一点，求职者也不会那么紧张，不过该问的都会问，和现场比，电话面试可能比较好的是，因为看不见，面试者可以边找答案边回答问题（这个我遇到过几次，每次问题都会隔一小会儿才回答 -_-!）。

（2）HTML、CSS相关问题

这部分是每个前端开发人员必须掌握的基础知识，基本上在这里的问题都答不上来的话，在面试官心中基本会减很多分；

这当中，我认为前端开发人员必须要掌握以下问题，也是面试官会经常问到的问题：

1、HTML中哪些是块元素、哪些是行内元素、还有空元素能举例吗

2、HTML5有哪些新特性

这里能说的有很多，比如语义化标签、增强型表单、Canvas、本地存储、websocket、Web Worker、拖放API等等；

这里可以延伸很多问题，比如让你说出常用的语义化标签、表单组件，或者说canvas与SVG的区别；

我比较喜欢问localstorage、sessionstorage与cookie之间的区别，这里就能考察出是否是滥用localstorage等一些问题啦；

3、css盒模型有哪些及区别content-box，border-box

4、CSS3的新特性，这里可能会很多

5、对响应式布局的理解

6、CSS的选择器

7、对浮动的理解，清除浮动的几种方式

8、哪几种方式可以实现DIV的水平垂直居中，这里会分知道高度和不知道高度的情况

9、可能深入一些的话，会问到浏览器的渲染引擎是怎么解析渲染我们的HTML文档以及CSS的

HTML、CSS是前端基础，这里所涉及的问题，可能都会在面试中遇得到，而且是必须要能回答的问题，所以如果以上问题没搞明白的话，可能就需要花点时间恶补一下了；

（3）Javascript、ES6相关问题

1、面向对象的特性（这个无论是java还是js都有可能会被问到类似问题）

2、JS的数据类型，String、Number、Boolean、Array、Object、Null、Undefined

3、JS的作用域链的理解

4、对闭包的理解，这个可能是面试必问问题

5、js数组的常用方法，数组是js常用的数据类型，所以这个问题会被经常问到，但是可能会延伸很多问题；

比如答到pop、push，我会在上面追问，用pop、push、shift、unshift这四个方法当中选出两个方法实现一个队列或者一个栈（感兴趣可以思考下）；比如答到map、reduce等方法，可能我会继续问在什么情况下使用，怎么使用等等；

6、JS继承的实现方式、这里会有很多种实现方式

7、对原型、原型链的理解，问过很多人，都答的很模糊或者答不上来

8、js中的call、apply的使用

9、对js中this关键字的理解

10、ES6的新特性，这里肯定会延伸很多问题，比如使用let，会拿来跟var作比较，甚至现场给出一段程序，让说出输出答案；

或者使用过promise，会接着问promise.all以及promise.race等等；async/await的理解；箭头函数的使用等；

11、使用过typescript没有，typescript的优缺点

当然可能还会有很多其它问题，这里也只是抛砖引玉，蛮重要的一点就是，对js应该要看重，而且是很重要，很多开发者只会使用jquery，对原生js很陌生，这就很可怕啦。

（4）前端框架问题

前端市面上可选的框架实在太多，大多数项目上使用的集中在react、vuejs、angularjs、angular等，因为我个人实在不太注重面试对各个框架的使用能力，毕竟每个项目上使用的都有可能不太一样，所以这方面的问题我都问的很少；最多会问问使用过什么框架，这个框架有什么优点及特性，为什么会选择使用它；进一步可能会问到什么是MVVM、MVC等，它们如何实现双向绑定的，路由的原理是怎样的；

类似于jquery、bootstrap或者其它一些ui框架、echarts等插件，几乎不涉及这类问题，我认为这些即使都只是工具，掌握了并不能对自身能力有太多提高，除非自己能深入挖掘这些框架库的实现原理，深入解读它们的源代码，不然只是会用，意义真的不大。

（5）综合类问题

1、对前端模块化怎么理解

这里可能还会问到例如前端模块化的规范有那些，你使用过什么模块加载器等等（有很多面试者可能在项目中都只是在技术经理搭建好的框架上直接按模块开发，对此并不熟悉，也没有深入研究过，问到过后会很懵逼）；

2、对前端工程化的理解

主要集中会问是否使用过gulp、grunt等构建工具，有没有写过npm的脚本，或者是对webpack的打包原理有没有研究过等等（很多框架都有自己的脚手架工具，开发者并不需要自己去搭建项目，对构建打包并不熟悉）

3、如何看待SPA，与AJAX有什么区别

4、有没有写过前端单元测试（这个其实在我们自己的项目中也未曾写过）

5、如何解决跨域问题

有没有使用过postmessage;JSONP、CORS的实现原理是什么？

6、HTTP协议

对HTTP协议的理解，常用的HTTP错误码；

7、什么是RESTFUL，前后端分离后，接口采用rest架构

（6）数据结构与算法

这方面的问题一般问的不多，可能会问常用的数据结构有哪些，简单举例；

再者就是可能会问点简单算法问题，例如冒泡排序、选择排序等。

（7）设计模式

会少量问到一些设计模式的问题，比如如何实现单例；简单工厂与抽象工厂的区别；甚至可能会问装饰器（这个在typescript中涉及）、代理及动态代理，不过一般都不会太多。

上面列了不少关于前端面试的问题，当然这不包含所有会遇到的情况，一般来说，面试官问问题，多数都会问到之后项目中会用到会涉及或者能沾边的问题，就像是前端面试中，一般都不会出现一些譬如让面试者回答C++呀、遗传算法、蚁群算法等这类型完全不着边际的问题，所以面试者还是应该多注重以上各类问题或者延伸开的问题的知识点；一般来说，面试官都是项目的管理者或者技术管理，所以他们要招的也都是今后跟自己一起工作的同事，因此对于他们，不光是看重面试者在开发上的技能，而且面试者的学习能力、工作态度以及性格都会是面试官的考量依据。

说了这么多，最重要的我觉得，对于前端开发人员，基础一定要打好，不能一味的追求各种框架，并没有太大的意义；只有自己真正懂得基本的实现原理，咱们不用别人的框架，也可以自己搞一套属于自己的框架；认准自己，不忘初心，就不会错。

正如前几天看到的这句话：

这个世界非常多样，自我实现的方式也绝不止哪一种。我们每个人都不一样，永远不要试图成为他人，那是妄想。我们唯一能做的就是看清自己并努力成为更好的自己，这条路永远都不会错！