web前端工程师面试技巧 常见问题解答

每年的春招是各企业需求人才的黄金时期,不少的前端大牛或者前端新手在面试时候不知道怎么来回答面试官的问题,下面来看下我转载的这篇文章吧,希望对从事前端工作的你有所帮助。

每到年后,便是换工作的高峰期,很多同学会开始面试马拉松。当然也会有一批人选择年前面试年后入职。今天,我决定聊聊关于面试的话题,以及前端工程师的面试套路. (ps:这篇文章摘自 医小生与程序猿 的微信订阅号)。

简历的细节

作为一个标准的理科生,我也曾大大咧咧不修边幅。但这毕竟是找工作,尤其是前端工程师,对于细节一定不能忽视。虽说面试以技术为主,但简历是敲门砖,一个潦草随意的简历必定是会减分的。简历都做成这样,做网页能好到哪去。

具体来说,有那么一些原则。首先,错别字是肯定不能有的,不多解释。除此之外,字体、字号,以及边界对齐,都要做到整体一致,视觉上舒适。有个人博客、个人作品的链接,最好把链接加上,这样别人一点就能看而不用复制到浏览器。有些同学会把简历做成图片的格式,导致连复制链接都不能,这是典型的不为他人考虑。有些同学在mac上用pages做简历,完了就把.pages文件发过来,你怎能确定对方hr就是在用mac办公呢?

这些细节重要吗?也没有多重要,但却能反映出你的个人习惯,以及与人交际的态度。换位思考一下,你就知道为什么这些细节不能忽视。想象一下,你跟一个同事要他的电话号码,他给你发了一段微信语音。

js套路

作为前端工程师的核心技能,js知识的考察是面试的重要环节。

一般来讲,如果面试者是初级工程师,我会先从基础问起。经典问题如js的原型继承、闭包、类型转化,常用函数的一些用法,比如很多同学都记不清数组的splice方法的三个参数。

对于只用过jquery的同学(大部分初级同学是这样),有几个问题是必问的,比如jq监听事件的几种方式及其异同点,在此基础上解释事件代理、事件冒泡机制。jq的一些方法的实现原理,比如$.inArray。jq插件的写法,解释$.fn是什么东西。

如果以上的回答比较满意,就开始问mvc、mvvm、模块化开发、ES6等这些脱离了“刀耕火种”年代的新东西。

如果对于新知识体系的掌握都不错,我还会问一些常见的性能优化,以及这些框架在实战项目中的优缺点。毕竟入门一个框架便可以泛泛而谈,但只有深入使用并解决一些复杂问题,才能有自己的见解。

然后是前端工程化方面的探讨。再往上就是项目的架构讨论,这种一般是问面试者目前工作中的架构,有哪些局限和可优化的地方。主要是想了解他是否有自己的思考,而不是在现有的框架之下停滞不前。

如果面试者是2~3年有经验的工程师,我会直接问mvvm这一层。如果发现他是那种工作3年却只有1年经验的类型,则往下降,开始问jquery方面的知识,不行就再往下降问基础。事实上我遇到的这种类型还真不少。

css套路

css是最容易被忽视的一块,也是最能挖掘出知识的一部分。

对于初级前端,我会先问应用。比如说左右两栏自适应如何实现,底部自适应如何实现,一些布局技巧如margin负值、各种情况的居中、盒模型的计算等等。

再往上就是原理性的一些知识,比如解释BFC的概念及常见场景。IE6兼容的问题我记得是很久没问过了,毕竟过时了。css与渲染性能也是需要知道的,我会问重绘和回流是怎么回事,如何在css布局阶段就减少性能浪费。

css 新知识相对少一些,基本就是css3和css预编译了。这块的话其实也没什么深度,大体上掌握了就能过关了。如果一定要看面试者的功力,那就是探讨sass/less框架下的整站css架构话题。

移动端套路

前端页面在移动端的舞台越来越大了,尽管如此,还是有些同学没有这块的经验。前端的知识断层就是这么严重。行走在移动端的前端还是有很多特有问题的,所以必须得考察。

最基本的就是布局问题,不同屏幕下的自适应。首先会问viewport的概念,解释清楚它是什么,默认值是多少,移动端如何通过控制viewport来实现自适应。

除此之外就是各种自适应的方法,百分比布局的问题啦,rem布局的问题啦,flex布局,以及css3的calc知道不知道。

由于移动端开发是一个经验密集型差事,很多问题的解决就是靠踩坑、靠经验。所以很多零碎的问题会随机来问,比如点击事件300毫秒延迟、绝对定位的兼容、ios下iframe兼容问题、scroll事件的性能优化、各种卡顿问题的解决方案等等。

算法及其他

一说算法,可能很多同学都头疼。甚至也有面试者在我提到这块时,直接就说你别问了,我算法不行。

其实算法一般是不问的,其他公司也应该也是这个情况,我知道美团除外。我问算法的情况一般是对方是软件工程或者是计算机专业毕业。毕竟这是基础课程嘛。

不会问很难的,因为算法这块我自己也不行,只能简单问一问探个路。说说常用的几种排序算法,找最大数、找中数,时间复杂度怎么计算的,差不多就这些了。

对于软件/计算机专业,操作系统、编译原理、计算机网络这些应该是基本课程,我有时也会问一问,但是我知道这对前端工程师来说属于“边缘知识”了,不起决定作用,算是附加题吧。

学习能力

学习能力是很重要的一个指标,对于新手尤其重视。判断学习能力其实是很难的,通常有那么一些角度可以观察到。

写博客。我未毕业的时候就开始写博客,并坚持到现在。我也坚持认为,自学到知识并能写文章表达出来,可以展示出一个人的学习能力。所以如果一份简历中有博客链接,我通常会仔细去看。

另外一个考察学习能力的方式就是看他的“折腾能力”。比如,就算工作中不用angular,你是否自己研究过它。是否自己研究过nodejs,乃至于Android、iOS开发,这都是有可能的。

再有就是问问他平时看的书、网站、APP等,如果一个人下班后就不关注程序开发,我不认为他学习能力强。因为学习本身就是克服惰性的一个过程。

沟通/表达/人品

在面试评估表上,这也是占一栏的。关于沟通表达能力的评估,会贯穿面试的整个过程。主要踩分点就是,你要知道面试官具体问的是什么,不要答非所问,也不要硬扭转话题,真实自然的表达即可。有一些“面试技巧”会教你说把谈论的话题往你擅长的方向引,在我看来这是愚昧的,因为面试官并不傻。

曾有一个面试者硬要给我背写出冒泡算法,尽管我已经说了不必写了,他还是不停。难道我会不知道这是他提前背好的吗?有一些比较“聪明”的会隐秘些,但难逃法眼。你要相信,面试或许会有运气成分,但绝无空子可钻。

诚实很重要。另外一个我比较看重的就是,人品。简单来说,你是否是一个顾及他人感受的人。有些人在面试的时候话比面试官都多,整个过程都是他在给面试官讲道理。就算你年龄比面试官大,工作经验很高,但此时此刻,你是面试者。

怀有谦卑之心的人是我一直喜欢的,然而要看透这一点并非易事。我一般会问面试者一个主观问题:你如何向一个完全不懂编程的局外人解释前端工程师这个职业。这个问题看似简单,但能考察他对前端的理解,他的表达能力,最难的是他要站在一个完全不懂编程的人的立场来解释清楚。大家可以试着回答一下。

在这里郑重的说一下: 机会只会垂青有准备的人!加油吧2017!

此文来自于:https://blog.csdn.net/u012118993/article/details/60584551

web前端工程师面试技巧 常见问题解答的更多相关文章

  1. Web前端开发面试技巧

    Web前端开发面试技巧 面试前端工程师对我来说是一件非常有意思的事,因为面试过程很大程度上也是自我提升的过程.无论大公司还是小公司,之所以在如何招聘到真正有能力的,前端工程师方面会遇到同样的问题. 近 ...

  2. 前端工程师面试问题归纳(一、问答类html/css/js基础)

    一.参考资源 1.前端面试题及答案整理(一) 2.2017年前端面试题整理汇总100题 3.2018最新Web前端经典面试试题及答案 4.[javascript常见面试题]常见前端面试题及答案 5.W ...

  3. Web前端工程师成长之路——知识汇总

    一.何为Web前端工程师?          前端工程师,也叫Web前端开发工程师.他是随着web发展,细分出来的行业.Web前端开发工程师,主要职责是利用(X)HTML/CSS/JavaScript ...

  4. Web前端工程师成长之路

    一.何为Web前端工程师?        前端工程师,也叫Web前端开发工程师.他是随着web发展,细分出来的行业.Web前端开发工程师,主要职责是利用(X)HTML/CSS/JavaScript/D ...

  5. 互联网产品团队中Web前端工程师的重要性

    国内外各大互联网公司,都有UEx/d|UCD|CDC(Customer Research & User Experience Design Center)团队. 在很多公司会认为,合格的产品经 ...

  6. 如何成为一名优秀的web前端工程师(前端攻城师)?

    程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · 詹姆士 我所遇到的前端程序员分两种:第一种一直在问:如何学习前端?第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀. ...

  7. 如何成为一名优秀的web前端工程师(转给自己,共勉)

    来源:王子墨的博客 程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · 詹姆士 我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到 ...

  8. 如何成为一名优秀的web前端工程师

    我所遇到的前端程序员分两种: 第一种一直在问:如何学习前端? 第二种总说:前端很简单,就那么一点东西. 我从没有听到有人问:如何做一名优秀.甚至卓越的WEB前端工程师. 何为:前端工程师? 前端工程师 ...

  9. 【转】如何成为一名优秀的web前端工程师(前端攻城师)?

    [转自]http://julying.com/blog/how-to-become-a-good-web-front-end-engineer/ 程序设计之道无远弗届,御晨风而返.———— 杰佛瑞 · ...

随机推荐

  1. Session有什么重大BUG,有什么方法可以解决

    [考点]ASP.NET中Session的多种保存方法.[出现频率]★★★☆☆[解答]使用进程内会话状态模式时,如果aspnet_wp.exe或应用程序域重新启动,则会话状态数据将丢失.可以用Sate ...

  2. Devexpress GridControl使用

    //不显示内置的导航条.            gc1.UseEmbeddedNavigator = false;             //不显示分组的面板            gv1.Opti ...

  3. Ubuntu 网速显示,ssh配置

    安装: sudo apt-get install python3-psutil curl git gir1.2-appindicator3-0.1git clone https://github.co ...

  4. ArcGIS创建要素类

    在使用ARCGIS软件进行工作时,免不了要建立地理数据库和要素类之类的.一下是我创建文件地理数据库并在数据库中创建要素类写相关步骤: 1.启动软件,可以使用ARCCatalog直接进行创建也可以使用A ...

  5. HBuilder中改造console.info

    HBuilder的js中console.info只会输出头一个参数,与谷歌浏览器行为不符合.让人很不习惯. 于是,对其改造一番. window.console.print=window.console ...

  6. 青石B2C商城

    平台: Windows 类型: 虚拟机镜像 软件包: azure commercial ecbluestone ecommerce ecommerce solution 服务优惠价: 按服务商许可协议 ...

  7. Mybatis:Reader entry: ���� 4

    Mybatis:Reader entry: ���� 4 现象:   产生原因:mybatis-config.xml里面配置了包的别名引发的   处理过程:注释掉 结果:就没有乱码了

  8. 动软代码生成器,主子表增加的时候子表的parentID无法插入问题解决方案

    StringBuilder strSql=new StringBuilder(); strSql.Append("insert into HT_XunJiaMain("); str ...

  9. ASP.NET写入和读取xml文件

    xml是一种可扩展标记语言,在电子计算机中,标记指计算机所能理解的信息符号,通过此种标记,计算机之间可以处理包含各种的信息比如文章等.它可以用来标记数据.定义数据类型,是一种允许用户对自己的标记语言进 ...

  10. MVC学习笔记:MVC实现用户登录验证ActionFilterAttribute用法并实现统一授权

    在项目下新建一个文件夹来专门放过滤器类,首先创建一个类LoginFilter,这个类继承ActionFilterAttribute.用来检查用户是否登录和用户权限.: using System; us ...