如何面试一个前端开发者

1.明确一下，很多面试因公司、公司规模、面试官以及你获得面试资格的渠道而不同。我曾经经历过这样的面试，在面试官坐下前，他显然并没有看过（或者记得）我的简历内容。另一方面，我也经历过其他一些面试，面试官在面试前已经事先了解了关于我的一切。因此，你对前端开发者面试准备，在实际面试前开始。

2，面试前，应该假设一下面试官将会深入调查你。确保你的网上作品集和相关的社会关系网络内容都是最新的。无论是个人网站、Behance、还是Dribbble，确保给人的第一印象是好的。这一点甚至可以在你踏入房间之前就能影响到面试官对你的看法。

3 世事多变，这种准备并非包罗万象的。将这些问题作为参考，同时一定记得:面试要放松。

如何面试前端工程师

HR是如何面试那些前端菜鸟的

　xx先后在twi**er,Stripe工作，期间会参加面试工作。实际上参加面试工作的人都知道要想在一个较短的时间内(30min-1h)就对一个应聘者做出判断其实是很难的，因此我们不得不想尽办法去更加合理的去判断面试者。下面是xx理出的一个思路:

　如果对方有github账号，我们会尽可能的去了解TA在开源项目上的动态和他的开源项目。我们也会从中挑出一些切入点，通过交流他做这个项目的出发点也能够更好的了解面试者的设计思路，也可以初步的去判断该人是不是适合团队。如果双方交流顺畅，接下来会直接进行到代码等一些基础问题上来。

　自己的面试会很实际，几乎全部都是coding,很少会提到算法和一些抽象的概念。自己提出的问题看似简单，但是每一点都涉及到javascript的一些知识领域。

　面试的'时候并不建议使用白板，通常希望面试者自己带上自己的笔记本，或者就使用自己的。我会将他们的代码运行，并告知结果。

　Object prototype

　我起初会提出一个非常简单的问题就是定义一个函数spacify ,将一个字符串作为参数传入，然后返回一个字符串，不过该字符串相对原有传入参数的变化是字母与字母之间多了一个空格。

　spacify('hello world') // => 'h e l l o w o r l d'

　虽然问题很简单，但这却是一个很好的开始，我们接下来的问题便可以围绕此展开, 尤其对于那些声称自己了解Javascript，但实际却连一个函数都不会写的面试者高下立判。

　正确的答案如下，不过一些面试者或许会选择for循环，当然这并没有错

　function spacify(str) {

　return str.split('').join(' ');

　}

　接下来，我会继续问如何将这个函数直接作用在一个字符串对象上.

　'hello world'.spacify();

　这个问题可以让我了解面试者对原型链的理解，这个问题可以让彼此展开一些有讨论，诸如直接在原型链上定义属性的危害等等.实际期待结果:

　String.prototype.spacify = function(){

　return this.split('').join(' ');

　};

　一般到这里我会让面试者讲讲函数声明和函数表达式的区别。

　Arguments

　接下来，我会去了解面试者对于 arguments的理解，我们会要求面试者定一个log函数。

　log('hello world');

　函数类似实现一个简单的控制台输出，在控制台输出传入的字符串。一边面试者都会在定义的函数里直接写console.log，不过还是有更优秀的面试者会直接使用apply。

　function log(msg){

　console.log(msg);

　}

　接下来，我会继续问如果我传入多个参数依旧输出一个字符串 ，我会提示面试者传入的 参数是不固定的，我会暗示xxconsole.log实际上也接受多个参数。

　log('hello', 'world');

　不过我还是希望您的面试者现在已经想起apply;面试者可能会在apply和 call上困惑，这个时候我会做点小提示，不过将console上下文传入也是非常重要的.

　function log(){

　console.log.apply(console, arguments);

　};

　接着我会继续追问，如果我希望在那个输出的字符串前统一加上(app) 这样的字符串，类似于这样:

　'(app) hello world'

　这个问题明显会复杂很多，面试者应该知道arguments是一个伪数组，我们需要先将它转换成正常的数组，我们可以使用Array.prototype.slice,代码如下:

　function log(){

　var args = Array.prototype.slice.call(arguments);

　args.unshift('(app)'); console.log.apply(console, args);

　};

　Context

　接下来我想了解面试者对于上下文以及this的理解，我会给出下边的代码，让面试者去解释count的值。

　var User = {

　count: 1,

　getCount: function() { return this.count;

　}

　};

　接下来我会给出下面的代码，让面试者去回答应该输出的正确答案。

　console.log(User.getCount());var func = User.getCount; console.log(func());

　上面的例子中正确输出1和undefined。实际上很多面试者都会在这里跌倒。func的上下文是 `window，因此已经失去了count属性。接下来我回继续追问面试者如何确保func的上下文始终都和User关联，这样可以使输出的答案是1。

　正确答案是使用Function.prototype.bind，代码如下:

　var func = User.getCount.bind(User); console.log(func());

　这个时候我会让面试者去进行完善，如果老的浏览器并不支持该方法，我们应该怎样去兼容。部分基础较差的面试者会比较纠结，但是个人认为任何一位前端工程师都应该对apply和call有着较为深刻的理解。

　Function.prototype.bind = Function.prototype.bind || function(context) {

　var self = this; return function(){ return self.apply(context, arguments);

　};

　}

　Extra points if the candidate shims bind so that it uses the browser's native version if available. At this point, if the candidate is doing really well, I'll ask them to implement currying arguments.

　一个弹窗库

　面试的最后y一部分，我会要求面试者写点实际的东西。这个非常有用，足以了解前端的技术栈。如果前面的问题回答的较为理想，这个问题，我会非常迅速的展开最后一个问题的考察。

　虽然最终效果取决于面试者的实现，但是这里依旧有足够的考察点。

　最好不使用 position:absolute而是position:fixed，这个时候即使窗体有滚动，也可以很好的遮罩住全局。我会提示面试者这样使用，并且追问这两者的区别。

　.overlay { position: fixed; left: 0; right: 0; bottom: 0; top: 0; background: rgba(0,0,0,.8);

　}

　如何将里面的内容居中也是一个非常重要的考察点。一些面试者会使用绝对定位，而有的面试者则更擅长使用Js。

　.overlay article { position: absolute; left: 50%; top: 50%; margin: -200px 0 0 -200px; width: 400px; height: 400px;

　}

　我会继续问，如何确保点击遮罩层时遮罩层是关闭的?这个问题可以将我们的讨论落脚到 冒泡中来。很多面试者都会直接将点击实践绑定到遮罩层上。

　$('.overlay').click(closeOverlay);

　这个接下来可以工作了，但是你会发现如果点击了遮罩层中的子元素，遮罩层也会关闭。解决方案是便是判断event target ，并且保证 这个时间不会冒泡。

　$('.overlay').click(function(e){ if (e.target == e.currentTarget)

　closeOverlay();

　});

　尾声

　当然前面的知识点仅仅是前端的一部分，实际上你还可以问:性能，HTML5 APIs， AMD vs CommonJS modules，constructors，数据类型，以及盒子模型。我经常都会随着面试者的进行去选择相应的问题

;

面试Web前端需要注意什么？会面试哪些问题？

1、基本知识

我们生活在互联网时代，你想知道的任何事情几乎都能在15分钟内找到相关信息。可是，能找到信息并不等于你会使用它。我认为所有前端工程师至少都应 该掌握某些基本的知识，才能有效地完成自己的工作。如果一遇到问题，就停下工作上网四处搜索解决方案，怎么可能保证按期完成工作呢？听听，还有谁在说“我 不知道，但我可以上网搜到。”请这些同学把手举起来，让大家认识一下（immediately raises a flag for me.）。下面我列出一些基本的知识点，这些都是我认为一名前端工程师（无论工作年头长短）在没有任何外来帮助的情况应该知道的。

DOM结构——两个节点之间可能存在哪些关系以及如何在节点之间任意移动。

DOM操作——怎样添加、移除、移动、**、创建和查找节点。

事件——怎样使用事件以及IE和DOM事件模型之间存在哪些主要差别。

XMLHttpRequest——这是什么、怎样完整地执行一次GET请求、怎样检测错误。

严格模式与混杂模式——如何触发这两种模式，区分它们有何意义。

盒模型——外边距、内边距和边框之间的关系，IE 8以下版本的浏览器中的盒模型有什么不同。

块级元素与行内元素——怎么用CSS控制它们、它们怎样影响周围的元素以及你觉得应该如何定义它们的样式。

浮动元素——怎么使用它们、它们有什么问题以及怎么解决这些问题。

HTML与XHTML——二者有什么区别，你觉得应该使用哪一个并说出理由。

JSON——它是什么、为什么应该使用它、到底该怎么使用它，说出实现细节来。

重申一下，上述这些知识点都应该是你应该“想都不用想”的东西。我一开始问的所有问题都是想摸清你对所有这些领域知识的掌握程度。虽然上面列出的这些知识点并没有面面俱到，但我觉得你至少应该掌握这些，才有可能跟我坐到一间办公室里来。

2、少量提问

我非常赞同面试者问的问题越少越好。反复问应聘者各种问题既不公平，也很无聊。我在任何一次面试中，通常只问三个大问题，但每个问题又会涉及我所能想到的多个方面。回答每个大问题一般要经过几个步骤，这样我就可以在每个步骤中穿插着问一些小问题。比如说：

现在有一个正显示着Yahoo!股票价格的页面。页面上有一个按钮，你可以单击它来刷新价格，但不会重新加载页面。请你描述一下实现这个功能的过程，假设服务器会负责准备好正确的股票价格数据。

这个问题牵扯到一组我想要考察的基本知识点：DOM结构、DOM操作、事件处理、XHR和JSON。如果我要求你对换一种处理股票价格的方式，或者 让你在页面中显示其他信息，就可以把更多的知识点包括进来。对于经验比较丰富应聘者，我也可以自如地扩展要考察的知识范围，最简单像JOSN与XML的区 别、安全问题、容量问题，等等。

我还希望应聘者给出的任何解决方案中都不要使用库。我想看到最原生态的代码，你就当页面中没有包含任何库。你说你对哪个库了解多少多少，但我不能把 关于库的知识作为评判能力的因素，因为库是会随时间变化的。我需要的是真正理解库背后的机制，特别是能够徒手写出一个自己的库的人。

3、解决问题

做为一名前端工程师，最值得高兴的事莫过于解决同一个问题会有很多种不同的方法，而你要做的就是找出最合适的方法来。我在提问的时候，经常会在应聘 者解释完一种方法后问他们还有没有第二种方法。此时我会跟他们说，假设你的这个方法由于种种原因被否决了，那么你还能不能给出另一种方法。这样做可以达到 两个目的。

首先，可以测试出他们是否在毫无意义地复述书本中的东西。不能不承认，某些人确实有过目不忘的天赋，听他们在那里滔滔不绝地讲，你会觉得他们什么都 明白。可是，只要一跟这些人谈到怎么查找方案无效的原因，以及能否拿出一个新方案来，他们往往就傻眼了。这时候，如果我听到“我不明白这个方案为什么不够 好”之类的反问，心里立刻就明白我的问题已经超出了他们的能力范围，而他们只是想拿自己死记硬背的结论来蒙混过关。

其次，可以测试出他们已经掌握的（还是那句话，“想都不用想”）浏览器技术知识。如果他们对浏览器平台的核心知识有较好的理解，想出解决同一问题的不同方案根本没有那么难。

对一名前端工程师来说，这绝对是最重要的能力。前端工程师在工作中遇到本该如此却并未如此的难题（说你啦，IE6），应该说是一件很平常的事。一个方案无效就无计可施的人，做不了前端工程师。

考核应聘者解决问题能力的另一层原因，与我的个人喜好有关。在搞清楚应聘者知道什么不知道什么之后，我就会想着问一个他们知识领域之外的问题。这样 做的目的，就是想看看他们怎样运用已有的知识解决新问题。在解决问题的每一步，我也准备了一些提示，以防有人会卡壳打艮（在我面前15分钟一言不发，对我 评价这个人毫无帮助）。我真正感兴趣的，是他们能够从上一步前进到下一步。我希望看到一个人就在我眼前学到新知识。

注意：所有问题都与浏览器技术相关。我不相信出几道抽象的逻辑题，就能够考出某人解决Web技术问题的能力。在我看来，这无异于让素描**画肖像（或者让刘翔跟博尔特同场竞技），没有意义，也得不到任何有价值的信息。

4、有**

要成为一名优秀的前端工程师，最重要的莫过于对自己做的事要有**。我们技能都不是从学校中或者从研讨会上学来的，因此前端工程师必须具备自学能 力。浏览器技术的变化可谓日新月异，所以也只有不断提升自己的技能才做得到与时俱进。我虽然不能强迫谁必须多看博客、不断学习，但想应聘前端工程师的人恐 怕还是必须这么做的。

你怎么知道谁对这种工作有没有**？实际上非常简单。我只问一个简单的问题：“目前你对什么Web技术最感兴趣？”这个问题永远不会过期，而且也几 乎不可能出错……除非你答不上来。就眼下来说，我希望你对这个问题给出的技术中包括WebSocket、HTML、WebGL、客户端数据库，等等。只有 对Web开发充满**的人，才会坚持不懈地学习新知识、掌握新技能；这些人才是我真正想要的。当然，我会让他们详细解释自己提到的技术，以保证他们不是随 口说了几个时髦的新词汇。

5、最后一点

计算机科学或者Web设计方面的知识当然也有用，但那都是基本知识之外的东西。只要基本知识在那儿了，一切就都有了基础，想扩充知识面也不难。可 是，如果等到正式上班以后，还得从头学习基本技能，那种难度是不可同日而语的。另外，高级前端工程师与一般工程师相比，肯定需要掌握更多的技能。而面试几 乎没有经验大学毕业生，同样也会有一套完全不同的程序。我在这篇文章里列出来的都是一些最基本的东西。

web前端 面试必问的几个问题?有那些?

作为一名HTML5前端工程师，为了工作，为了就业我们免不了要参加各种各样的面试。为此总结了面试前的注意事项：

第一：注意自己的仪容仪表

面试之前，一定要再次从头到脚地将自己的仪容仪表检查一遍。检查时主要包括，自己的牙缝是不是还有食物残渣，所以你需要就近找一个卫生间，如果没有卫生间就近找一个角落也是可以的，但是切记一定不要在大庭广众之下。因此，为了给自己整理出着装的时间请在约定时间前20分钟到达。

第二：再次检查面试时所需的资料是否都已带全

这些资料主要包括：身份证明、学历文凭证明、个人简历、以往作品等等，如果这些东西齐全之后，需要对这些资料做一个整理与排序。因为没有哪个面试官希望看到面试者拿出一堆“莫名其妙”的东西塞给他，让他自己再一页一页的翻找自己需要的内容，如果说这些资料在面试官手中不小心散落一地，结果可想而知。这样的求职者在面试官眼中也一定不是一个让人放心、有条不紊的员工。当然如果检查时发现资料没有带全，也不要紧张。反而你要庆幸幸亏及时检查，也有足够的时间组织语言去向面试官解释。

第三：面试之前将通信工具调成振动或关闭状态

虽然说面试者与面试官之间是一个平等的关系，但毕竟你是去人家公司求职的，始终处于一个被动的状态，所以最起码的尊重还是要做到的。曾经有调查显示，对于面试过程中接电话或是被电话打断的求职者，会被HR减分。

第四：等候面试官时，仔细观察多了解面试公司

在等候面试官时，可以暗自观察一下公司的大体情况比如员工的着装风格、公司的LOGO或是贴在墙上的企业文化、公司的环境等等，一来可以在接下来的面试过程中表现出自己对公司的认同感，二来也可以让自己对求职公司多些了解，以确定是否要接受这里的工作。如果你身边有公司的资料宣传架，不妨取一本翻看一下，也会增加HR对你的好感。

第五：放松心情，保持自信

面试时一定要保持一定的自信，这样也会给面试官留下很好的印象。面试只是你步入工作的第一步，即便是失败了那也是人生重要的经历。失败是为了更好的迎接下一个挑战。

作为一名web前端工程师千万不要觉得懂技术面试就能万事大吉了，像以上五点细节性的东西也是一定要掌握的。

面试题系列：

网页链接

想要面试前端，应该准备个什么项目合适

web前端 面试必问的几个问题?有那些?

根据面试官的不同，面试的内容页不一样的。一般的话就是+css布局占一部分，例如各浏览器的相容性，然后就是js的ajax，闭包，冒泡什么的，js会占很大一部分，也有一部分面试官会抛开这些，直接问公司需要的内容，这样的话就是考验你的实际操作了，这类的面试官我很喜欢，就是直接问布局，资料填充之类的，能学到很多东西，建议面试时偷偷用手机录音，回来之后听一听，研究一下自己不会的问题，因为面试完之后，你可能就会忘了面试时都问过什么了

web前端 面试 会问哪些问题

对公司这个行业有什么样的看法，未来的职业规划，自己做好该职位工作的优势，个人缺点是什么，还有就是一些技术性问题了。web前端 面试 会问哪些问题

web前端开发的几个问题

1.巢状表单一般不会有什么问题，主要是看业务需求，不过尽量还是不要使用巢状。

2.name只是标签的属性，一般的网页标签元素都可以使用这个属性，并非只能表单域里的标签才能使用。比如 div、span、input等等都可以有name属性。

3.JQuery已经成为JS指令码开发的标配了，本身的体积也比较小，最主要的是简化了很多JS操作，而且我们基本不用考虑JS的浏览器相容问题了。至于效能和原生的JS没什么区别，放心使用吧。

面试Web前端需要注意什么？会面试哪些问题？

将这些问题作为参考。

希望你的面试官有点经验，不会用以下这样的问题开场。以防万一，还是准备一些答案。

1.为什么选择程式设计师这个职业生涯?

2.截至目前，你所从事的专案中最喜欢的是哪个?

3.描述一下你梦想中的研发专案。

另外一些面试官会问一些通用的技术问题，来测试你的技术能力。有可能部分人不知道这些问题是什么意思，而仅仅是在考察你的能力/竞争力。基于面试官的技术能力级别的不同，你的答案也会有所不同。这些问题简单易答，因此把这些问题记下来。

1.描述一下建立一个新网页的过程

2.怎样减少页面载入时间?

3.标准和标准体(standards and standards bodies)为什么重要?

4.你使用怎样一个过程来组织程式码?

5.你喜欢用什么工具来测试程式码效能?[page]

既然你从事前端工作，理解CSS会非常重要。因此这里为你准备了一些常见的CSS问题。这是展示你知识储备的重要开始。这些并不是最尖锐或者重要的问题，如果不能回答出来，将对你很不利。

1.CSS 中的 resetting 和 normalizing 之间的区别有哪些?

2.什么是floats，它是如何工作的?

3.absolute、relative、fixed 和 static 定位的区别是什么?

4.解释visiblity hidden和display none之间的区别

5.你是如何修复特定浏览器预设样式的问题?

6.你是否用过网格系统?目的是?

7.如果计算CSS权重?

8.解释如何优化CSS选择器。

9.为什么需要使用预编译器?

10.你是如何测试网站的跨浏览器相容性?

现在我们最基本的任务完成了。谁都能死记硬背这些答案来应付以上问题。即使是新手前端开发者也能出色地回答大部分问题。然而如果想真正让你的面试官印象深刻并证明你的功底深厚，就把下面这些问题牢记在心。

1.前端开发的框架是什么?

2.响应式web app和原生应用程式的区别是什么?

3.原生app相对web app的优点是什么?

4.客户端和伺服器端开发的区别是什么?

5.什么是SASS和LESS?它们是如何工作的?

面试官会更多关注你是如何表达对这些问题的解释。他们会追问支援你的答案的工作案例。前面的问题你可能可以通过记忆而过关，你可能还会遇到这些问题的扩充套件，但这些答案的深度，将让你与众不同。通过你参与过的实际专案，来展示你的思考过程。

web前端jquery面试题有哪些

常见的几个如下：他们的答案可以百度搜。

1. jQuery 库中的 $() 是什么？

2. 网页上有 5 个