【前端面试总结】2016-02-22

前言

本次找工作第三次面试。今年年后第一次面试。与第一次面试相似，面的H5岗位。是同一个外包公司安排到同一个金融集团下的另一个子公司下进行的面试。

自己感觉，这次面试对技术问题的回答比第一次好，更加比第二次好。但似乎面试官比较不满意。内心着实郁闷，总感觉有哪里不对劲。写完这篇记录才发现，并不比第一次面试好到哪里去。

过程

面试地点在深圳，面试官在北京，采用远程视频进行的面试。不知道面试官那边效果怎样，我这边声音效果还行，相互对话没有障碍，但我看到的画面效果非常差，两个面试官，只能看到一个面试官的模糊轮廓，看不清（到）脸，另一个面试官则轮廓都看不到。

面试过程也跟第一次相似，首先自我介绍，然后回答技术问题。

自己做过的完整项目，擅长的技术

根据自己认为的实际情况说了，JavaScript及相关内容比较熟练。C比较熟练，C++涉及到模板等相对复杂内容不够熟练。php、python、ios等做过一点，能做一点，不熟练。

因为做过的东西都相对较小，想把能讲的项目都一笔带过地都讲一下。结果只讲了个五六年前做的一个网站（用.net web Forms开发的）

html5的新内容

以最早用.net做的网站为背景，面试官问了对html5新技术的了解。
回答：用过require.js,了解过sae.js,知道其实现是怎么回事。
有了解过react，知道其主要的实现原理。
平时自己做东西，因为只是自己的东西，较少考虑旧的浏览器，html5的新接口使用的还是比较多。

前端页面实现跨越

对于这个问题，我很有信心，首先想到了三种自认为最主要的跨域方式，CORS、JSONP、WebSocket。
其中CORS名字不记得了，说了在服务端进行设置，设置允许的域和请求头。
当时对这道题挺有信心的，因为感觉这就是跨域最主要的方式，而且自己都做过（现在想想，WebSocket是做过，webSocket跨域并没做过）。
但面试官似乎不大满意，称要用前端实现，不要设置服务端；JSONP要特殊处理；WebScoket有性能问题。要求我回答其他方案。没能很好接上，想了会，想到了不同子域松散到同一个父域，实现同一父域下的跨域，又提了一下JSONP。
面试官继续问JSONP的实现，答了JSONP的js文件调用客户端函数；答了客户端能够载入跨域的js资源，js文件载入后会自己执行。自认为最重要，最核心的原理已经讲出来了。
对于JSONP的js文件执行客户端所定义函数时可以通过函数参数传递跨域数据，因为记忆不够清晰，也没时间理清思路，没有很好讲出。可能因为这点没讲清楚，可能前面的表达也不够好，面试官似乎并不满意。

判断对象是否为数组

这个问题，开始以为回答得还好。后来细想，遭点很多。
现在想想，面试官想要的答案应该是instanceof,或者可能typeof(作为错误答案）。
我回答，js的数组中加了一个专门的函数（isArray）,但不记得函数名了，直接说了；还回答了采用原型对象进行判断。
自己以为答得很好，但面试官并不满意，追我其他答案。再想了一下，终于想到了instanceof,但记成了isinstanceof，英语不好，读音应该很不标准。并提了instanceof的实现就是采用的原型对象比较。
自认为答案完整了，但面试官明显不满意。又补问了一个，用原型判断怎么写。【本问题最大一个错误在此犯下】。答成了xxObject.prototype == Array.prototype。当时没感觉到错误，面试官提醒了一遍依然没感觉到错误。
最后，面试官补问了typeof的问题，问typeof(ArrayObj)等于多少，答对象，面试官确认了一遍，答object，我知道是这个。面试官继续问typeof(undefined),因为没记得太清楚答undefined，并说明了不确定。对此面试官一直不满意，我也一直没明白为什么，自己答对了呀，回来后还确认了typeof(undifined)的结果就是undefined。直到写到这段话，终于想起，typeof的所有结果值都是字符串，我当时没说（也没关注到，确认typeof(undefined)结果时都还没关注到）。

页面适应手机屏幕

回答了媒体查询，根据屏幕宽度不同设置不同的样式。
面试官说，要问的不是这个，说网页在手机中打开会出现页面缩小的情况，怎样让一个图片在手机上显示正常大小。
回答html的头部可以设置允许用户缩放的范围和页面的初始缩放。
感觉面试官没有很满意，可能面试官期待的是其它或者更多的答案。自己没有涉及其它更多内容，没补充上来，面试官也没继续追问。

canvas

问是否有了解。答去年写过红黑树，整个过程的红黑树图形就是用canvas画的。页面链接
问canvas有几种清屏模式。这个不记得的，直接回答比较久没弄了，不记得了。

能记起来的就这些。

之后面试官顺便向深圳这边确认了，我通过的话是加入他们的外包方（感觉是在确认可否放低要求），称具体结果看机试情况。之后出会议室，被安排到外面等机试。之后一人出来告知hr MM今天就这样，先等通知。然后准备跟hr一起离开了，离开前还向hr反应了被安排过等机试的情况。hr还帮忙去重新确认了一下，最后结果是等确定面试通过了再安排来机试。（应该没疑问是未通过了）

问题总结

项目

自己做过的小项目，玩具型项目挺多，涉及的技术也非常杂乱。
（1）没有突出的标志型项目，这已经成为找工作不容易的一个重要原因。
以后需要着力打造自己的标志型项目。将以下两个网站持续完善改进：
1.以后将作为个人主站和资料、工具收集站
2.个人业余项目——知县网
（2）许多小项目，没有很好的总结，所涉及的技术已经没有当年清晰，甚至很不清晰；项目的具体实现方式，各种技术的使用方式，许多都已经不够清楚，甚至不能正确说出来。
虽然该问题在本次面试中没有暴露，但在之前的许多面试或多或少是有暴露的，尤其是上一次面试。
虽然以前确定了向前端方向发展，但许多技术是相通的，之前的许多非前端项目依然有总结价值的，何况自己最终目标是要做全栈的（绝不是仅仅一个node.js)。
以后要逐渐梳理自己曾经做过的项目，用过的技术，形成文档，并根据与工作方向的紧密程度逐步深化。

前端跨域实现

面试完回去的路上，想到了iframe，自己以前接触过iframe跨域的。本次找工作第一次面试时，面试官问的iframe，后来也考虑的了可以在回答中加上iframe中跨域数据不能获取的问题；自己当时答过的，曾用url中hash字段传递数据就是iframe实现跨域数据传递的例子。但因为考虑跨域问题时一直很少考虑到iframe，没有足够重视。以后对iframe，iframe跨域需要继续补课。

回去之后查了一下跨域的实现，看到了postMessage，这个以前有了解，但一直没有认真对待，这次该认真对待了。

写这个记录时，有突然想到，14年在广州第一次知道跨域问题时，当时公司同事提的解决方案好像是web service转接。而我面试时说的服务器端设置（CORS）可能就是被面试官理解成了服务端消息转接，甚至面试官要的答案可能就是CORS。记清楚名称，清晰细节很重要。

判断对象是否为数组

记清楚名字instanceof
原型链，看了很多次，以为自己清楚了，结果又掉链子了，在掉链子的地方补上__proto__,这个14年在广州是有接触过的，用sipml5时，ie9中对象时而有__proto__时而没有，之后也没管了，看原型链时也会看到，不够在意，结果没记清楚。JavaScript的原型一定要非常清楚、清晰，不能有死角。

页面适用手机

有个说法，html是电脑页面，html5是手机页面，做html5的大多在关注手机。对我来说，html5主要是提供了更多的js接口，在现实中或许html5主要是手机页面。专门针对手机的技术，再小的技术点也是重要的技术点。以前有关注的，但还是不够得进一步加强。

canvas

canvas是html5提供的一个强大功能扩展，有时间一定得努力掌握。但短期内，目前还是补其它坑为主。

总结

整个面试过程，自我感觉良好。虽然看不清甚至看不到面试官的脸，但明显能够感觉到面试官不够满意。虽然没有第二次面试那么糟，但所面的就是自己要的前端（H5）岗位，挺郁的。通过事后的回忆，特别是这篇记录的撰写，发现自己面试中的糟点真的很多，有些是自己能定位的，有些自己不能定位，但已感觉到其存在。
已经发现的问题要一个一个消灭，未发现的问题要继续发现。