A. 前端怎么面试才能拿到高薪Offer
1. 要有比较好的计算机基础
这里的计算机基础指的是数据结构与算法，操作系统，编译原理，计算机网络等等。虽然相对于其他方向而言，前端在工作中用到计算机基础的地方可能少一点，但是无论大小厂，招实习生其实都是为正式招聘做储备，所以会比较希望招将来有更大发展空间的人，就像里 Web 前后端分离的意义大吗？ - 知乎用户的回答 和 怎样成为全栈工程师（Full Stack Developer）？ - 知乎用户的回答 描述的那种。
如果你具备比较好的计算机基础素养，那么以后在拓展到其他领域（WebGL —— 计算机图形学，Node.js 底层 —— 操作系统，JS 引擎和各种预编译工具—— 编译原理, etc.）的时候会更快上手。另外有一些公司对前端的概念不局限于 Web 前端，也包括移动端偏前端的部分，这里也需要你有比较好的计算机基础才能做好。前端领域有很多人已经不满足于造轮子，直接跑去造语言了，如果你编程基础够好，接触过各种形形色色的编程语言和范式，再上手这些东西也会方便些（比如Ruby/Python->CoffeeScript，Haskell->LiveScript）。
虽然也有很多地方为了招到足够多能来干活的前端会降低对计算机基础的要求，但是打好这方面的基础是没有坏处的，如果面试笔试被问到且答得上来，也是能够加分的。一些大厂经常会出现“不是前端的面试官来面前端”的情况，我个人是觉得如果这类面试官问的都是计算机基础问题的话，其实真的无可厚非，毕竟人家在面“一个前端程序员”之前，是在面“一个程序员”啊……
2. 要懂得现代前端的一些新技术
比如：
前端自动化工具（Gulp/Grunt等）
模块化（CommonJS，AMD/CMD模块加载器，各种Bundler，ES2015 Moles等）
前端 MV* 框架（Backbone，Angular等）
编译到 CSS 和 JS 的一些语言（Less/Sass/CoffeeScript等）
前端自动化测试工具（Karma，Mocha，Web Driver等）
其他
有一些同学觉得这些东西懂得越多越好，我个人是觉得这些工具不一定要都了解（毕竟它们很多也未必能火多久），但对这些东西要有大致的概念，并且每个领域的用过一两种（最好是在项目里），清楚它们的优缺点和必要程度。这是区分在前端上投入过一定精力的人和跨行来兼职前端的人的标志。
去大厂校招应聘前端的会有很多只是做过一些 Web 项目，但不一定对前端的技术很了解，只是看前端门槛比较低就去投简历的人。如果你对这些新技术比较了解的话，起码能够证明你是比较专注前端而且花过一定时间在上面的。
同时，前端现在确实是一个每天都有很多轮子冒出来的领域，也需要你有足够强的自学能力和（英文）文档阅读能力去跟上社区的这些新动态。接触过比较多的轮子，才会有自己的判断，不会老是人云亦云火一个学一个。这些工具里，确实也有很多在合适的场景下可以提高前端的生产力或者代码质量，对这些东西有一定关注，也表明你对自己的生产力和代码质量是有一定关注的，这其实是一个更广义的靠谱程序员的特性。
3. 懂得什么是 Web 标准和浏览器开发维护的流程，并且会跟进新发布的标准和主流浏览器新实现的特性
当然面试的时候一般不会直接问你这方面的问题，但是如果你懂这里面的水大概是怎么一回事的话，在很多问题上（特别是兼容性问题上）都能回答得比较深刻一些。最好清楚：
HTML、CSS、DOM，ECMAScript 和一些泛 HTML5 的标准是怎么制定的
W3C 和 WHATWG 的区别
各种标准的不同版本和提交状态是怎么回事
知道标准和实现的差距（有些人喜欢把 W3C 标准奉为圭臬，但现实中浏览器们并不是这样的）
知道 ECMAScript 和 JavaScript 的区别
知道浏览器的一些常见做法（比如给 CSS 特性加前缀）的缘由
标准和浏览器这滩水还是很浑的，涉及到很多利益纠葛和大厂的博弈，如果你大概清楚他们的一些事情，不光自己做前端兼容的时候会容易一些（不会只抱怨“为啥XXX就是不能OOO”而是懂得他们的无奈并且认真寻找解决方案），在新特性出来的时候也更容易消化（不是“啊又出了个新东西要学好烦啊”而是“在邮件列表上争（si）论（bi）了那么久他们终于把这个搞出来了”），你自己对前端比较基础的那部分的知识体系更会有条理得多。个人觉得这也是区分比较有经验的前端和临时跨行的前端的关键之一，这些东西是需要你经过一段时间的耳濡目染才能理清楚，而且会在一定程度上影响你的工作的。
4. 多看书，多关注技术资讯
技术资讯的来源包括RSS、邮件订阅、比较重要的邮件列表、或者follow Twitter和微博上一些比较有影响力的开发者。个人经验是，一般在二面或者三面的时候，面试官都会问类似“你从哪里接触前端的新技术/你看过哪些书”的问题，因为前端现在技术更新很快，比较专注于前端这方面的人一般都会有自己接触新技术的渠道，他们自然也会比较关心候选人是不是有在跟进社区的一些动向。其实这也能够排除那些不太靠谱的临门跨行的人，因为他们平时一般不会特意去关注前端技术的新动态的。
5. 不仅懂得一些东西怎么写，更要懂得一些东西不要怎么写
Web 标准大多不是严格向后兼容的，很多几年前常用的写法，现在已经被社区的大多数人强烈建议避开了，有很多特性也随着时间的流逝被打上了 deprecated 的标签，如果你不幸拿着一本比较老的书入门，又不在网上验证上面说的每一句话，那么很有可能你就这样被误导很久，比如 HTML可能会逐步被XML所取代吗？（来自《css权威指南》） - 贺师俊的回答 这样的情况……与之类似的还有：
JavaScript 里那数量令人叹为观止的坑
一些在经验比较丰富的前端看来属于常识的东西（比如：为什么 CSS 大多放在 head，JavaScript 多放在 body 底端？）
划分各种模块、文件，添加模板的正确方式（比如错误方式是一堆脚本/样式写在一个超大文件里，或者在有替代方式的情况下在 JavaScript 里拼字符串）
解决一些老问题的新的best/better practice（比如不要到了 2015 年还深陷在回调地狱，去看看 promise 和 generator）
……
这些知识都需要你有一定的前端方面的经验，看过比较多相关的博客和书，才能慢慢积累起来，所以也能区分靠谱的前端和不靠谱的前端。
6. 不依赖某一个特定的框架或者库
比如很常见的“离开了jQuery就不会写前端”星人……也不是说要做原生 JavaScript/CSS 和 DOM 的原教旨主义者，但高度依赖某个框架或者某个库的话，通常意味着换了一个框架/库你的学习成本会比不依赖特定轮子的人高，因为这通常是处于还不知道前端领域“什么是什么”的阶段的表现。
事实上前端领域的这些轮子有一些都是其他领域早就有，或者根本不需要的东西，其中很多的实现原理也不是那么复杂，只不过是脏活累活。个人觉得对这些东西应该报以“不能知其然而不知其所以然”的态度，起码大概清楚它们的实现是怎样的套路，知道它们的优缺点，多接触几种，这样在换一个替代品的时候很快就能上手。
因为前端的特殊性，在开发比较大的项目的时候使用库和框架是必须的（比如遇到各种鼠标事件的前端兼容问题时，总不能全都就地写 if-else 吧，总得封装一下。遇到非常 data-driven 的项目，还用手动操作 DOM 的写法很难维护吧，用个 MV* 框架真的不纯是偷懒了），但是这些东西都是会迅速改朝换代的，死守着某个特定的库或者框架，确实不太靠谱。很多公司喜欢问候选人“原生 API 写个 Ajax 请求怎么写”这类问题，感觉很大程度上也是在排除这类人……
7. 懂一点点设计
这里说的不是切图啊PS啊AI啊什么的，而是大概懂基础的视觉传达/色彩构成/平面构成的知识。毕竟前端是和设计师联系最密切的程序员，虽然前端要做的事不仅仅包括 UI/UX，但是 UI/UX 却都主要依赖前端来实现。很多时候，设计师（特别是不会前端技术的设计师）给出的设计可能很难（在照顾兼容性的前提下）实现，这个时候不应该跟他硬拼让他改设计，或者自己默默纠结怎么用很 hack 很难维护的方法去实现，而是理解设计的意图，并且跟设计师沟通，尽可能在工程上容易实现容易维护的前提下实现设计的意图，哪怕要修改一些具体的表现形态。
最恐怖的就是丢一张图过来，让你做到 pixel perfect，你也不问三七二十一直接开工，代码写得别扭也不去沟通，遇到不兼容就打个哈哈蒙混过关了……设计的目标是让大众都能更容易地使用，这样做是与设计师存在的意义背道而驰的，我也遇到过一些设计师会主动来问前端怎样的设计在浏览器里容易实现，怎样的设计比较别扭，这样他才能结合多方面的信息去做设计上的决定。如果你对设计不关心，不与他交流的话，实际上相当于剥夺了一些关心工程实现的设计师的知情权（一般正常的设计师看到自己的设计实现出来效果不好，也会小郁闷的……）。个人觉得与设计师沟通的技巧，也是一个靠谱的前端应该具备的素养。
8. 懂一点点后端
（这个是我看了一下别人的答案补加的）。其实这个和第一点的目的类似，最重要的是别要做一个非得等队友来才能开工的人。大厂（主要是阿里系）有不少在用 Node 做前后端分离一类的事，另外做前端的经常要在后端还没写完的时候自己去 mock 一下数据接口，如果你懂怎么搭建简单的服务器和 serve 数据给前端，那么就可以提高开发的效率。即使你只想专注前端，但前端有很多东西（比如 JS 跨域，WebSocket，SSE，WebGL 的素材获取）都需要你懂得架设简单的后端才能去实践，这时候不懂后端通常就意味着你要放弃学习这些知识，或者只能纸上谈兵。一个正常的前端肯定是要对计算机网络和 HTTP 等协议有一定了解的，有了这些知识去学简单的后端其实是很水到渠成的事情。
9. 在前端投入足够的时间
意识到以上几点还需要投入足够多的时间才能看到成果，不然很容易出现“道理我都懂，可是OOO”的情况，那最后也还是靠谱不了的……如果不是真的对前端感兴趣并且投入足够多的时间，与其为了“好找工作”而投前端，不如转一个更合适的方向。阿里前端的困局与突围 · Issue #141 · lifesinger/lifesinger.github.com · GitHub 和 图灵社区 : 阅读 : 企业软件领域前端开发的困境 都能说明这个问题。
另外有些面试官喜欢问你一些很细节的 API （虽然我个人觉得这类问题很囧），这些东西很多时候都是靠的“无他，但手熟尔”，虽然有一些确实有点刁难人的味道，但有一些真的是如果你经常写前端，重复多几次就会记住的，如果记不住，只能说明你前端写的不够多。还有一些没足够实战经验的人很少遇到过的问题（比如 JS 跨域），也是需要在前端投入足够多的时间，才会接触到（无论是纸上谈兵，还是项目里遇到）。
其实综上所述，不靠谱的前端大概表现就是：计算机基础不好（更糟糕的是编程基础都不行，不过编程基础和计算机基础好不好跟绩点高不高专业对不对口这些其实真的不一定有什么关系……），对前端的认识还停留在十年前，对社区出现的新工具完全不认识（没认识全很正常，但完全不了解就有点两耳不闻窗外事一心只读圣贤书的味道了……），不懂 Web 标准是怎么回事或者不在意标准，遇到兼容问题就复制粘贴搜到的代码，对于一些在社区里是常识的坑毫无意识地各种踩，“离开了jQuery/某库/某框架就不会写前端”星人，或者平时根本没怎么做过前端的东西，只是做做 Web 项目顺带写前端，到应聘了临门一脚跑过来……不管是平时学习还是笔试面试，尽量避免向这些特征靠拢就可以了。事实上大厂们招人不一定会要求这么严格，而且大厂里的团队本身也未必个个靠谱，但是平时有在这些方面努力的话，起码如果挂了会知道自己哪里不足，或者到底是他的问题还是你的问题……
以上大概就是我觉得拿到大厂（or前端比较靠谱的中小厂）前端offer需要的水平，其实我感觉没必要拿“实习”这个词来限定自己，尽量往高水平靠拢，才能做到是你来选公司，而不是公司来选你，这样你才能结合兴趣/家庭/个人规划之类的因素拿到最适合自己的 offer。另外，我觉得面试这回事是这样的，上面提到的这些特征，每一条单独拿出来，在不确定面试官的情况下，既不是拿到offer的充分条件，也不是拿到offer的必要条件，某一条不满足，也不是拿不到offer的充分或必要条件。大厂的面试官有很多种，有些设计出身喜欢问设计，有些后端出身喜欢问偏后端的东西，有些喜欢问你API细节，有些喜欢问你实现思路，有些喜欢看你学习能力，有些面试官本来就不是前端所以喜欢问你基础题。如果你侧重某一些方面，虽然无可厚非，但是运气不好遇上期望不同的面试官，可能你就会得到比较低的评价或者挂掉。确定能拿 offer 的唯一途径，就是面面俱到，这当然是不可能的要求，但大厂的种种因素配合起来往往就是在找这种不存在的人才，真的想拿 offer 的话，就只有硬着头皮尽量靠拢。
就像国内很多大厂里比较着名的前端们文章/博客/知乎里提到过的一样，前端这块水不是很深，但水非常非常宽，在考虑将来作为一个前端如何发展如何应对天花板之前，先要脚踏实地把这些属于前端的“本分”的东西搞好。事实上前面提到的这些东西我也没有全都做到。作为前端，个人觉得最重要的是要保持一颗开放、谦卑的心，不要抵触新东西，永远记得外面的世界还有很多东西自己不懂，要继续学习。
B. 面试Web前端需要注意什么会面试哪些问题
作为一名HTML5前端工程师，为了工作，为了就业我们免不了要参加各种各样的面试。为此总结了面试前的注意事项：
第一：注意自己的仪容仪表
面试之前，一定要再次从头到脚地将自己的仪容仪表检查一遍。检查时主要包括，自己的牙缝是不是还有食物残渣，所以你需要就近找一个卫生间，如果没有卫生间就近找一个角落也是可以的，但是切记一定不要在大庭广众之下。因此，为了给自己整理出着装的时间请在约定时间前20分钟到达。
第二：再次检查面试时所需的资料是否都已带全
这些资料主要包括：身份证明、学历文凭证明、个人简历、以往作品等等，如果这些东西齐全之后，需要对这些资料做一个整理与排序。因为没有哪个面试官希望看到面试者拿出一堆“莫名其妙”的东西塞给他，让他自己再一页一页的翻找自己需要的内容，如果说这些资料在面试官手中不小心散落一地，结果可想而知。这样的求职者在面试官眼中也一定不是一个让人放心、有条不紊的员工。当然如果检查时发现资料没有带全，也不要紧张。反而你要庆幸幸亏及时检查，也有足够的时间组织语言去向面试官解释。
第三：面试之前将通信工具调成振动或关闭状态
虽然说面试者与面试官之间是一个平等的关系，但毕竟你是去人家公司求职的，始终处于一个被动的状态，所以最起码的尊重还是要做到的。曾经有调查显示，对于面试过程中接电话或是被电话打断的求职者，会被HR减分。
第四：等候面试官时，仔细观察多了解面试公司
在等候面试官时，可以暗自观察一下公司的大体情况比如员工的着装风格、公司的LOGO或是贴在墙上的企业文化、公司的环境等等，一来可以在接下来的面试过程中表现出自己对公司的认同感，二来也可以让自己对求职公司多些了解，以确定是否要接受这里的工作。如果你身边有公司的资料宣传架，不妨取一本翻看一下，也会增加HR对你的好感。
第五：放松心情，保持自信
面试时一定要保持一定的自信，这样也会给面试官留下很好的印象。面试只是你步入工作的第一步，即便是失败了那也是人生重要的经历。失败是为了更好的迎接下一个挑战。
作为一名web前端工程师千万不要觉得懂技术面试就能万事大吉了，像以上五点细节性的东西也是一定要掌握的。
面试题系列：
网页链接
C. web前端开发面试流程是怎样的
首先投简历，等待hr通知面试，一般情况下先填资料，做测试题，接着开始第一面（一般问经你的个人情况，工作经历等），资料已经交给技术，等一面通过之后接着二面，二面一般是技术面试，问你开发相关的技术问题（例如布局问题，js,框架之类的），有些公司还需要上机操作（写一两个页面或者开发一个js方法等），有些公司是通过之后直接进行3面有些是改天再进行3面，3面一般就是项目经理或总经理问你一些各种各样的问题（随机应变就行，也有一些公司没有这个环节），如果3面都过了，基本上就是面试成功了，接下来就是4面，也就是人事主管和你谈工资待遇等问题了，这个谈好之后就会告诉你什么时候过来上班，要准备什么东西，当然一般还会有正式的工作邀请函发到你的邮箱。如果没有3面的公司，那人事这个环节就直接是3面了。
还有一些公司是一面之后等通知，通过的就通知你二面，然后再等通知，然后通过再三面（这样的公司我一般不会等，太浪费时间）
D. 电脑培训分享前端面试需要掌握哪些html问题
程序员技术面试是永远都不会缺席的，所以为了能够让大家顺利的通过面试，我们今天就一起来了解一下，与html相关的一些面试题都有哪些。
1、什么是盒子模型?
有些面试官会问你对盒子模型的理解，在我们平时看到的网页中，内部的每一个标签元素它都是有几个部分构成的：内容(content)、外边距(margin)、内边距(padding)、边框(border)，四个部分组成，当你说完这些面试官是不会满意这个答案的，因为还有一个重点(IE盒模型和标准盒模型的区别)———IE盒模型的content包括border、padding
本文由@IT·平头哥联盟-席填坑官?苏南分享
2、页面导入样式时有几种方法，它们之间有区别?
link标签引入，也是当下用的多的一种方式，它属于XHTML标签，除了能加载css外，还能定义rel、type、media等属性;
@import引入，@import是CSS提供的，只能用于加载CSS;
style嵌入方式引入，减少页面请求(优点)，但只会对当前页面有效，无法复用、会导致代码冗余，不利于项目维护(缺点)，此方式一般只会项目主站页使用(腾讯、淘宝、网易、搜狐)等大型网站主页，之前有看到过都是这种方式，但后来有些也舍弃了
小结：link页面被加载的时，link会同时被加载，而@import引用的CSS会等到页面被加载完再加载,且link是XHTML标签，无兼容问题;link支持动态js去控制DOM节点去改变样式，而@import不支持，
3、简单讲述一下块元素、内联元素、空元素有哪些，它们之间的区别?
行内元素有：a、b、span、img、input、select、textarea、em、img、strong(强调的语气);
块级元素有：ul、ol、li、dl、dt、dd、h1、h2、h3、h4p、section、div、form等;
空元素：inputtype="hidden"/>、br>、hr>、link>、meta>;
小结：块元素总是独占一行，margin对内联元素上下不起作用;
4、说说cookies，sessionStorage、localStorage你对它们的理解?
cookie是网站为了标示用户身份而储存在用户本地终端上的数据(通常经过加密)，cookie数据始终在同源的http请求中携带，记会在浏览器和服务器间来回传递。
sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。
大小：cookie数据大小不能超过4k,sessionStorage和localStorage虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。
时效：localStorage存储持久数据，电脑培训http://www.kmbdqn.com/发现浏览器关闭后数据不丢失除非用户主动删除数据或清除浏览器/应用缓存;sessionStorage数据在当前浏览器窗口关闭后自动删除。
E. 前端开发面试回答，你怎么回答
我面试过很多 前端程序员，非常了解面试者和面试官的心理，我可以很负责的告诉你：
就算面试你的人说你只能拿8K，但是你完全可以通过各种方法去拿到10K以上的薪资！
面试的时候面试官都是什么样的心理？
大多数公司的领导都会通过给你构造一个宏伟的蓝图以及对你进行技术打击，来让你降低标准，因为任何一家公司都希望花最少的钱请到最NB的技术人才，其实双方就是一个周旋的过程，看谁的情商更高一些，但往往都是面试者被面试官拿下的情况比较多。
我给面试经验不多的 前端程序员4个建议：
1、说工资时千万不要说自己的理想工资，在这个之上虚高一点！
假设你预期的薪资是10k，你很实在的说要10k，那么按照常理来说，你的工资标准是一定会被往下进行打压的。
你可以先说自己以前的工作的薪资在11K左右，现在换份工作想要13K的薪资，这个时候面试官就会想，这个人以前的工资是11k，现在给他10k他肯定是不会来的，但他还是会跟你进行压价，但是压价肯定都是在10k以上的，所以你和面试官谈判的时候，如果他认可你，那么你的薪资应该就会在10k-13k之间，无论最终是10k还是11k或者12k，我们的目标都已经达到了。你可以进行一番思考，最终同意对方的开价。
但是你不要跟轻易的答应，一定要拿捏一下，让对方觉得你也在考虑，最终你选择了他们公司，要表达出对他们公司的愿景，自己中意的是职业发展，喜欢的是公司氛围等等因素，这样对方才会认为你是看重公司的发展，而不是因为工资。关于这点我只能说，华夏民族的人和人交流的关系是世界最微妙的，这些套路大家心知肚明，但是你用和不用还真的是两种效果。
2、设置一个自己的心理价位
如果对方说的薪资低于这个心理价位，我们一定要果断拒绝，保持我们的原则性，不要因为对方说了而让你降低了自己的心理价位，这样也会让面试官觉得你非常的有原则，非常自信，人们都尊重这样的人，如果你一味的做舔狗，下场会非常悲惨。
根据我十年多的IT从业经验来看，即使是做同样的工作，也会存在着很多工资高低差距较多的情况，所以不要掉在一棵树上，现在社会工作机会这么多，只要有实实在在的技术，工作是很容易找的，一定要多去尝试。
3、凸显自己的价值，让对方觉得你是个人才
如果之前两点没有达到预期成效，但你又非常看好这家公司，就该尽力争取了；
用自己之前做成的事情说事情，最好是用数据给面试官说明，表达清楚自己为什么要这样的薪资，让对方感觉到你值这么多钱，如果对方公司现在比较缺人，而且你要的薪资没有特别离谱，还有有希望拿下的。
4、公司一般都有奖金福利可以弥补工资的欠缺
大多数人都想不到那么远，都是盯着眼前的薪资，但其实很多公司都有项目提成、奖金，这也是钱啊，有一些不错的公司都是14薪往上，所以在跟公司谈的时候，一定要去问他们是否有奖金、年终奖之类的福利。
除了被压榨薪资的问题，还有以下几点是必须要注意的！
1、项目作品
面试的时候，除了基础的知识技术外，一个项目经验是非常重要的，面试官会着重去问你的项目过程，所以准备好一份好的项目实战，不只是证明你对这次面试的重视，更是证明你有能力胜任这份工作的利器。
2、去背那些常问的面试题
面试题对于以下几个问题都会问：
·自我介绍（建议30s-60s）
·了解我们公司的基本情况吗？
·你上家公司离职的原因是什么？
·你自己的职业规划是什么？
·自我评价一下自己的优缺点？
以上问题都是大部分公司都会问到的，其实面试官只是想多了解你一些，而这些回答在网上有非常标准的答案，如果你觉得自己回答不好，你可以去网上找一些标准的答案背一下，还是非常有必要的，做到万无一失。
3、假设面试官没有跟你说薪资的问题，那么我们也不要主动去提及，这样会显得你非常的着急，最好是先拿到offer之后再去谈薪资，这样对于我们来说是非常有利的，经验之谈。
4、面试的时候不要对方问一句你就答一句，你一定要明白面试的本质是什么，在短时间内展示你的才华，方方面面的才能，给对方留下一个好的印象。
5、面试的过程中，是你展现的时候，所以80%的时间都应该你来主导，你来展示自己的才能，一定要非常着重的表现自己。
6、在回答面试官时，换位思考几秒钟：
·他为什么要问这个问题？
·他想知道什么答案？
·他想通过这个答案判断出什么？
所谓知己知彼才能百战不殆，你一定要换位思考对方问的问题，想要知道什么，从你的回答中他是否可以得到他想要的答案，所以面试是一门非常深的学问，人与人之间心理的博弈。
总结：
以上全部都是面试技巧方面，这属于细活，而真正掌握技术才是根本，如果你没有掌握良好的技术，技巧也帮助不了你找到一份工作，当你的技术达标，在加上好的面试技巧，就是如虎添翼，工作随便你选择。
常在这里回答问题，热爱技术，喜欢帮别人解答行业技术问题和行业知识。
如果大家对于学习前端有任何不懂的可以随时来问我，我给你提供一个非常不错的前端交流学习qun：前面是二九六，中间是二一二，后面是五六二。有问题就在里面问我，这样你可以少走很多弯路，做起来有效率，记得多跟有经验的人交流，别闭门造车。如果没有比较好的教程，也可以管我要。
F. 前端开发者面试必备的3个点
最近是招聘旺季，我也在负责我们公司的招聘，但是面试过程大部分前端面试者给我的感觉思维比较窄，以及陈述问题时候比较乱，整体给人感觉不是理想。下面是我作为一个面试官从三个维度给面试者建议和思考吧。
一.自我介绍
1.自我介绍，可以简单介绍你毕业什么学校，什么专业
2.出来负责的项目，每个项目自己充当的角色
3.每个项目使用前端技术+后端技术
简单大概的说出来就可以了，不要详细到你哪年进入公司，哪年离开公司，负责项目做什么的，说一大通。这个对我们面试官来说，想让你自我简单介绍，其实考察点有两方面：
A.面试者的表达能力和概括能力
B.面试者目前掌握什么技术，做过什么项目，在项目中的角色来初步判定这个人的能力
二.问题回答
在本人问他们做过项目中，自己感觉挑战最大的项目是什么，你在这个项目中做了什么，遇到什么问题，怎么解决这些问题的
1.有些面试者给我的答案直接说没有比较大的挑战;这个让我感觉这个人可能没有听懂我的问题，工作那么多年，难道没有一个项目可以拿来说的，那我拿什么来判定你的能力呢?难道凭你几句话，说我很牛逼的，没有什么困难难得到我?我就信任你了，伯乐寻找千里马都要知道几个千里马的特征吧。所以没有你也要在面试前准备好自己做过的项目和总结，在项目中自己做了什么，充当什么觉得。
2.有些面试者回答这个问题，在介绍项目的时候，很大概的说，还有就是一句话前端都是我做的，这些都是我设计的;这个让我感觉这个人也没有听懂我的意思，我在问你这个问题的时候，肯定是希望你详细介绍你的项目，这个项目使用者是谁，让我知道谁在使用这个项目;你负责哪些模块，哪些组件，那些模块实现什么业务逻辑，用到什么技术，这个能让我更加知道你项目的业务，才能从你描述中我知道这类的业务会遇到什么问题，以及你使用的技术是否合理，能让我更加判定你的能力，才能更好的提出问题，才能更好的面试下去。
3.回答问题的时候不要想到什么就答什么，要有陈述性，比如1,xxx;2.yyyyy;3.wwww的陈述，这样能让我知道你总结过，表达和陈述上比较清晰，思维好;想到什么答什么的，让我感觉思维可能比较乱，有可能我听懂了你的表述，但是让我感觉表达能力有些欠缺。
4.以及在你项目中遇到的问题，你要陈述问题，你是怎么思考的，而不是针对问题就直接说网络，google就解决了。我们大家都知道，遇到问题都会去网络，google.但在这问题的前提条件是问题是，架构上的问题，还是代码的bug问题，还是方案上的问题。你至少陈述清楚，是不是还有其他方案，在其他方案中，你为什么选择这个方案。这个能让知道你在面对问题的时候，你是否思考了其他的问题，想得越多，知道能体现出的思维比较发散，遇到问题可以有其他方式解决，而不是死磕一棵树上。
三.前端技能
前端技能在问到很多面试者的时候感觉自己都懂前端，其实他们只是懂使用js敲代码而已，很多前端知识，以及前端原理都不懂，只会使用的话，那么永远只会走来人家的后面。就那一个比喻来说吧，如果你只是一个会开车的司机，不会修车或者造车，那么如果哪天车出了毛病，你都不知道，到时候才去学习车的构造原理。或者你会说我直接给维修厂不就可以了，如果维修厂关门了呢怎么办。所以我们前端开发人员还是要脚踏实地，不要说我会使用vuejs，react前端框架，问你一个mvvm模式是什么，你都说不知道，怎么实现mvvm框架，在不使用别人开发mvvm框架，自己可以开发一个简单的mvvm框架?前端的开发者问问自己?以我个人的要求，前端开发者必须掌握
1.HTTP协议
2.前端安全
3.常用前端框架的三驾马车react,vuejs,angularjs目前比较流行的以及jquery(工具库)的使用
4.前端基础知识，跨域，es6新语法
5.Nodejs的开发，express，koa等常用框架
6.了解一些数据库知识
7.能理解封装业务组件和公用组件
8.前端性能优化
9.前后端分离
如果可以，能掌握更加深层次的知识点：
1.前端架构，设计模式
2.前端工程化开发，测试，打包，发布
3.自己实现前端架构代码以及开发工具
这些是我近期的一些总结，也希望能给最近正在找工作，最近准备开始转行前端的小伙伴们一个方向。
在面试前做好准备，找好自己的定位，成功收获高薪!
G. 前端开发职位面试的时候一般会问什么样的专业问题
一、 关于常见的问题（每题10分，共110分）
1. 自我评价一下HTML/CSS/JS的掌握情况
2. 块级元素和行内元素都有哪些? 行内元素有哪些特点?
3. 函数的几种定义方法
4. 对象的定义方法？
5. 类的定义方法（prototype）（继承）？
6. 什么是闭包，及其作用？
7. ”==”和“===”的不同?
、、、、、
各职位各公司面试问题答案：星宿人才
H. 面试web前端的工作,会被问到什么问题
在实际的面试中，你可能需要使用 JavaScript、CSS 和 HTML 来编写代码。在你的面试期间，你可能需要实现 UI、构建窗口小部件或使用 Lodash 和 Underscore.js 这样的库编写常用的实用程序函数。例如：构建常见的 Web 应用程序的布局和交互，例如类似 Netflix 网站那样的。实现小部件，如日期选择器、轮播或电子商务网站购物车。写一个类似 debounce 或深度 clone 对象的函数。
I. Web前端岗位面试题有哪些
前端面试题汇总，基本上会有四大类问题，具体如下：
一、HTML
1、Doctype作用？严格模式与混杂模式如何区分？它们有何意义?
2、HTML5 为什么只需要写 <!DOCTYPE HTML>？
3、行内元素有哪些？块级元素有哪些？ 空(void)元素有那些？
4、页面导入样式时，使用link和@import有什么区别？
5、介绍一下你对浏览器内核的理解？
6、常见的浏览器内核有哪些？
7、html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？
8、简述一下你对HTML语义化的理解？
9、HTML5的离线储存怎么使用，工作原理能不能解释一下？
10、浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢？
11、请描述一下 cookies，sessionStorage 和 localStorage 的区别？
12、iframe有那些缺点？
13、Label的作用是什么？是怎么用的？（加 for 或 包裹）
14、HTML5的form如何关闭自动完成功能？
15、如何实现浏览器内多个标签页之间的通信? (阿里)
16、webSocket如何兼容低浏览器？(阿里)
17、页面可见性（Page Visibility）API 可以有哪些用途？
18、如何在页面上实现一个圆形的可点击区域？
19、实现不使用 border 画出1px高的线，在不同浏览器的Quirksmode和CSSCompat模式下都能保持同一效果。
20、网页验证码是干嘛的，是为了解决什么安全问题？
21、tite与h1的区别、b与strong的区别、i与em的区别？
二、css
1、介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？
2、CSS选择符有哪些？哪些属性可以继承？
3、CSS优先级算法如何计算？
4、CSS3新增伪类有那些？
5、如何居中div？如何居中一个浮动元素？如何让绝对定位的div居中？
6、display有哪些值？说明他们的作用。
7、position的值relative和absolute定位原点是？
8、CSS3有哪些新特性？
9、请解释一下CSS3的Flexbox（弹性盒布局模型）,以及适用场景？
10、用纯CSS创建一个三角形的原理是什么？
11、一个满屏 品 字布局 如何设计?
三、常见兼容性问题？
1、li与li之间有看不见的空白间隔是什么原因引起的？有什么解决办法？
2、经常遇到的浏览器的兼容性有哪些？原因，解决方法是什么，常用hack的技巧 ？
3、为什么要初始化CSS样式。
4、absolute的containing block计算方式跟正常流有什么不同？
5、CSS里的visibility属性有个collapse属性值是干嘛用的？在不同浏览器下以后什么区别？
6、position跟display、margin collapse、overflow、float这些特性相互叠加后会怎么样？
7、对BFC规范(块级格式化上下文：block formatting context)的理解？
8、CSS权重优先级是如何计算的？
9、请解释一下为什么会出现浮动和什么时候需要清除浮动？清除浮动的方式
10、移动端的布局用过媒体查询吗？
11、使用 CSS 预处理器吗？喜欢那个？
12、CSS优化、提高性能的方法有哪些？
13、浏览器是怎样解析CSS选择器的？
14、在网页中的应该使用奇数还是偶数的字体？为什么呢？
15、margin和padding分别适合什么场景使用？
16、抽离样式模块怎么写，说出思路，有无实践经验？[阿里航旅的面试题]
17、元素竖向的百分比设定是相对于容器的高度吗？
18、全屏滚动的原理是什么？用到了CSS的那些属性？
19、什么是响应式设计？响应式设计的基本原理是什么？如何兼容低版本的IE？
20、视差滚动效果，如何给每页做不同的动画？（回到顶部，向下滑动要再次出现，和只出现一次分别怎么做？）
21、::before 和 :after中双冒号和单冒号 有什么区别？解释一下这2个伪元素的作用。
22、如何修改chrome记住密码后自动填充表单的黄色背景 ？
23、你对line-height是如何理解的？
24、设置元素浮动后，该元素的display值是多少？（自动变成display:block）
25、怎么让Chrome支持小于12px 的文字？
26、让页面里的字体变清晰，变细用CSS怎么做？（-webkit-font-smoothing: antialiased;）
27、font-style属性可以让它赋值为“oblique” oblique是什么意思？
28、position:fixed;在android下无效怎么处理？
29、如果需要手动写动画，你认为最小时间间隔是多久，为什么？（阿里）
30、display:inline-block 什么时候会显示间隙？(携程)
31、overflow: scroll时不能平滑滚动的问题怎么处理？
32、有一个高度自适应的div，里面有两个div，一个高度100px，希望另一个填满剩下的高度。
33、png、jpg、gif 这些图片格式解释一下，分别什么时候用。有没有了解过webp？
34、什么是Cookie 隔离？（或者说：请求资源的时候不要让它带cookie怎么做）
35、style标签写在body后与body前有什么区别？
四、JavaScript
1、介绍JavaScript的基本数据类型。
2、说说写JavaScript的基本规范？
3、JavaScript原型，原型链 ? 有什么特点？
4、JavaScript有几种类型的值？（堆：原始数据类型和 栈：引用数据类型），你能画一下他们的内存图吗？
5、Javascript如何实现继承？
6、Javascript创建对象的几种方式？
7、Javascript作用链域?
8、谈谈This对象的理解。
9、eval是做什么的？
10、什么是window对象? 什么是document对象?
11、null，undefined的区别？
12、写一个通用的事件侦听器函数(机试题)。
13、[“1”, “2”, “3”].map(parseInt) 答案是多少？
14、关于事件，IE与火狐的事件机制有什么区别？ 如何阻止冒泡？
15、什么是闭包（closure），为什么要用它？
16、javascript 代码中的”use strict”;是什么意思 ? 使用它区别是什么？
17、如何判断一个对象是否属于某个类？
18、new操作符具体干了什么呢?
19、用原生JavaScript的实现过什么功能吗？
20、Javascript中，有一个函数，执行时对象查找时，永远不会去查找原型，这个函数是？
21、对JSON的了解？
22、[].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16) }) 能解释一下这段代码的意思吗？
23、js延迟加载的方式有哪些？
24、Ajax 是什么? 如何创建一个Ajax？
25、同步和异步的区别?
26、如何解决跨域问题?
27、页面编码和被请求的资源编码如果不一致如何处理？
28、模块化开发怎么做？
29、AMD（Moles/Asynchronous-Definition）、CMD（Common MoleDefinition）规范区别？
30、requireJS的核心原理是什么？（如何动态加载的？如何避免多次加载的？如何 缓存的？）
31、让你自己设计实现一个requireJS，你会怎么做？
32、谈一谈你对ECMAScript6的了解？
33、ECMAScript6 怎么写class么，为什么会出现class这种东西?
34、异步加载的方式有哪些？
35、documen.write和 innerHTML的区别?
36、DOM操作——怎样添加、移除、移动、复制、创建和查找节点?
37、.call() 和 .apply() 的含义和区别？
38、数组和对象有哪些原生方法，列举一下？
39、JS 怎么实现一个类。怎么实例化这个类
40、JavaScript中的作用域与变量声明提升？
41、如何编写高性能的Javascript？
42、那些操作会造成内存泄漏？
43、JQuery的源码看过吗？能不能简单概况一下它的实现原理？
44、jQuery.fn的init方法返回的this指的是什么对象？为什么要返回this？
45、jquery中如何将数组转化为json字符串，然后再转化回来？
46、jQuery 的属性拷贝(extend)的实现原理是什么，如何实现深拷贝？
47、jquery.extend 与 jquery.fn.extend的区别？
48、jQuery 的队列是如何实现的？队列可以用在哪些地方？
49、谈一下Jquery中的bind(),live(),delegate(),on()的区别？
50、JQuery一个对象可以同时绑定多个事件，这是如何实现的？
51、是否知道自定义事件。jQuery里的fire函数是什么意思，什么时候用？
52、jQuery 是通过哪个方法和 Sizzle 选择器结合的？（jQuery.fn.find()进入Sizzle）
53、针对 jQuery性能的优化方法？
54、Jquery与jQuery UI有啥区别？
55、JQuery的源码看过吗？能不能简单说一下它的实现原理？
56、jquery 中如何将数组转化为json字符串，然后再转化回来？
57、jQuery和Zepto的区别？各自的使用场景？
58、针对 jQuery 的优化方法？
59、Zepto的点透问题如何解决？
60、jQueryUI如何自定义组件?
61、需求：实现一个页面操作不会整页刷新的网站，并且能在浏览器前进、后退时正确响应。给出你的技术实现方案？
62、如何判断当前脚本运行在浏览器还是node环境中？（阿里）
63、移动端最小触控区域是多大？
64、jQuery 的 slideUp动画 ，如果目标元素是被外部事件驱动, 当鼠标快速地连续触发外部元素事件, 动画会滞后的反复执行，该如何处理呢?
65、把 Script 标签 放在页面的最底部的body封闭之前 和封闭之后有什么区别？浏览器会如何解析它们？
66、移动端的点击事件的有延迟，时间是多久，为什么会有？ 怎么解决这个延时？（click 有 300ms 延迟,为了实现safari的双击事件的设计，浏览器要知道你是不是要双击操作。）
67、知道各种JS框架(Angular, Backbone, Ember, React, Meteor, Knockout…)么? 能讲出他们各自的优点和缺点么?
68、Underscore 对哪些 JS 原生对象进行了扩展以及提供了哪些好用的函数方法？
69、解释JavaScript中的作用域与变量声明提升？
70、那些操作会造成内存泄漏？
71、JQuery一个对象可以同时绑定多个事件，这是如何实现的？
72、Node.js的适用场景？
(如果会用node)知道route, middleware, cluster, nodemon, pm2, server-side rendering么?
73、解释一下 Backbone 的 MVC 实现方式？
74、什么是“前端路由”?什么时候适合使用“前端路由”? “前端路由”有哪些优点和缺点?
75、知道什么是webkit么? 知道怎么用浏览器的各种工具来调试和debug代码么?
76、如何测试前端代码么? 知道BDD, TDD, Unit Test么? 知道怎么测试你的前端工程么(mocha, sinon, jasmin, qUnit..)?
77、前端templating(Mustache, underscore, handlebars)是干嘛的, 怎么用?
78、简述一下 Handlebars 的基本用法？
79、简述一下 Handlerbars 的对模板的基本处理流程， 如何编译的？如何缓存的？
80、用js实现千位分隔符?(来源：前端农民工，提示：正则+replace)
检测浏览器版本版本有哪些方式？
81、我们给一个dom同时绑定两个点击事件，一个用捕获，一个用冒泡，你来说下会执行几次事件，然后会先执行冒泡还是捕获
J. web前端经典面试题
为大家带来一些web前端的面试题，希望可以帮助到大家啊。
1.css3有哪些新特性?
选择器、圆角、动画、多重背景、背景的宽度高度flex布局响应式布局边框阴影文本阴影
2.响应式布局怎么理解的，响应式布局是通过什么实现?
根据不同的屏幕加载不同的css样式
1).移动端适配
2).一套代码适配pc端移动端多个
3.js创建对象有哪几种方式?
1).自面量
2).newObject
3).构造函数
4.es6有哪些新特性?
1).letconst
2).模板字符串
3).方法的简写属性的简写
4).三点运算符
5).解构赋值
6).箭头函数
7).setmap
8).class类
9).模块化
5.箭头函数和普通的方法有什么区别?
1).箭头函数省略了function
2).箭头函数里面的this指向上下文(可以改变this指向)
6.gulp可以干什么
gulp自动化构建工具。
压缩代码合并代码压缩图片自动处理前缀创建web服务处理sass
7.清除浮动有哪些方法。
1).浮动元素的父元素overflow:hiddenoverflow:auto
2).浮动元素的最后面加一个空div给他clear:both
3).after伪类清除浮动
.clearfix:after{
content:"";
dislpay:block;
height:0px;
clear:both;
}
4)、给父元素设置高度。
8.行内元素块元素的区别?
1)块元素默认独占一行，行内元素默认情况不独占一行，行内元素的的宽度就是内容的宽度
2)默认情况块元素可以设置宽度高度默认情况行内元素不可以设置宽度高度
3)默认可以margin上下左右，行内默认只能margin左右不能上下。
9.网站加载速度优化?
1).图片不失真尽量小
2).多个背景图片合并
3).代码压缩代码合并
4).js写到页面最底部
5).懒加载
6).不要有冗余代码
7).服务器带宽款一些
8).服务器固态硬盘
9).开启缓存
10.以前写代码什么情况会成出现乱码怎么解决?
解决乱码文件保存的编码和设置的编码必须保持一致
11.以前如何测试调试移动端页面
1).首先在浏览器自带的调试工具模拟器里面调试
2).真机的内置浏览器调试
3).真机上面的UC里面调试
4).真机上的微信里面调试。