周二收到二面邀请，是个女面试官姐姐，声音真好听。约周四下午面试，挂完电话真的好激动。

没想到自己也能进二面，名校出身的同学可能理解不了这种面试机会对我们多么珍贵。

沟通问题

一个人学习编程蛮寂寞的，短板也很多，这次面试就暴露出很多问题。例如，向面试官描述自己的具体项目经历。即使我已经有准备了，但是在电话面试中，我还是没有完全向面试官说清楚我的思路。（缺乏实际沟通，希望在以后实际工作中和别人多多交流）面试官也超nice，叫我挑一个具体的实际问题说说思路，当时好紧张，然后我就说了一个我在游戏中出现的问题，碰撞检测。也不知道面试官后来理解没有。有些尴尬。

面试题总结

在不支持dom2级的浏览器下，使用dom0级进行事件绑定？

因为我看过红宝书，所以知道这个概念，dom0级就是使用最原始的element.onclick = fn;形式，当时给自己挖了个坑，脑子反应快了也不好，当时立马想到这个不支持多个事件绑定啊，会被覆盖掉，面试官问我那怎么绑定多个事件？我大脑秀逗了（Cry），说使用命名空间。然后想了半天也没想出来。

面试完，在qq群问小伙伴，有人提出使用自执行函数，给绑定的函数里面增加自执行函数。但是感觉不是很好，繁琐，不易于移出事件。后来有个提了更好的方案，我觉得也应该是实际答案，我在task2任务中写util工具函数的时候。有一个需求，对一个元素移除绑定的事件，当最后一个参数为空的时候，则移出这个元素的指定事件如‘click’下的所有绑定事件。当时我的解决方案是给这个元素自定义属性，例如使用element[‘on’+type] = [fn1,fn2,fn3];通过数组的方式，回调函数挂载到元素身上，那么也可以运用到刚才这题，在元素执行click的时候，找元素身上挂载的回调函数，然后遍历这个数组执行回调函数。

function addEvent(elem, type, fn) {
    var evName = 'ev' + type;
    if (!elem[evName]) {
        elem[evName] = [];
    } 
    elem[evName].push(fn);
}


function fire(elem, type) {
    var evName = 'ev' + type;
    for (var i = 0; i<elem[evName].length; i++) {
        elem[evName][i].call(elem);
    }
}

这种方式有种自定义事件的感觉。

position的四个值

当时我说了有四个值，然后分别表述一下四个值的作用区别，大脑在此处有短路了，absolute是生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。这辈子应该不会在忘记了。

fixed在ie6下的兼容性处理

此处有点绕，我一开始不知道怎么说成display：inline-block的兼容写法了，然后又扯成动态改变滚动条的高度，明明是滚动条高度改变，元素top值改变，这个还是面试官姐姐提醒了一下，不然我一直说错下去了，最后好像也还是没有表达清楚。

重新描述一下：当打开一个页面的时候，滚动条的距离顶端为0，而元素相对可视窗口定位，也就是第一屏定位，页面打开的时候，获得可视窗口的高度和宽度，改变定位元素的left，top值，当用户往下拉滚动条（此处绑定滚动事件）随即对元素的top值 = 最开始原始top值 + 滚动条距离顶端的值，面试官还考虑到了当浏览器窗口大小改变的时候怎么办？此处我回答错了，我回答成了onsize事件，好久没用这个事件了。正确答案应该是onresize。以前做过需求，兼容ie6，右下角定位一个返回顶部，唉，没想到还是有这么多问题。谢谢面试官暴露出我这些没掌握好的知识点。

页面字体加粗

分别使用html，css，js对字体加粗

当时问面试官能不能用js方式改css样式，得到否定的答案，我以为就是不能使用font-weight属性了，然后就没朝这方面想，实在没想出来怎么改变字体粗体。

后来面试官在下一个问题说了一下改变元素的style属性，就反问我刚才这个问题，面试官此处真nice，通过这种方式面试蛮好的。我就说了一下需要驼峰式 style.fontWeight = ‘bold’;

页面加载问题

考查onload和DOMContentLoaded。亏我还看了jquery对这方面的兼容性问题处理，心塞了，只记得一个上面doScroll(“left”)，但是到底是干嘛的一直说不上来了，面试官对我印象也大打折扣了。

然后找了一下答案：IE下我们可以通过侦听document.documentElement.doScroll()来判断DOM树是否完成，原理是IE下只有当DOM树构建完成后才能doScroll。但它还不是尽善尽美，它在IE下无法判定iframe的内容是否加载完毕。

反思：思考问题不深入，容易忘记，只记得个大概。以后遇到类型问题要勤于记录。

dom节点相关

问了各个dom节点的操作，其中子节点我好像答错了。我答得是childNode，正确答案应该是childNodes。

最快的方式在body里面插入一个节点

当时手机信号超不好，而且说好了叫我室友下完课去隔壁宿舍呆一会，可是他们就这么回宿舍直接玩电脑，我当时超担心他们敲键盘被面试官听到以为是我在用电脑。

当时没理解清楚需求，我以为是判断body是不是加载好了，然后考虑在body最后面使用脚本生成一个节点，后来还说了轮询方式判断body有没有生成，反正各种没答到点子上，后来面试官说是插入节点的方式，我说使用appendChild的，Cry，唉，答案又错了。面试官姐姐最后说用insertBefore比较好，生成到最前面，浏览器是从上往下执行的，直接插入到最后面会有问题。

反思：沟通几次还没理解面试官的需求，实习招聘算是废了，校招的时候努力攒点面试经验。培养临场沟通和反应能力。

元素清浮动

答了一下BFC，块级格式化上下文。

最后一个开放大题

发送一个mp3的音频url，谈一下对这个事件的播放，暂停，资源异常等等各种。

这个题目算是我答得最差的，真的一直没理解面试官姐姐问的题目意思。

最搞笑的是我居然说既然是url，用户直接点开不就播放了吗？

这个题搞得好心累，一直不是很懂需求，答得很乱。

我后来答得是，创建一个audio元素，src指向刚才那个url，资源加载完成触发onload事件,加载失败触发onerror事件。在onload里面绑定按钮播放事件，挂不得面试官姐姐有些疑惑。根本没播放按钮，哪来播放事件。

查了一下api
设置audio属性controls 为true显示播放控制，比如可以点击播放，暂停。
也可以单独创建元素，模拟播放器，控制音频的播放onplay，暂停onpause。
资源在加载中是onprogress

数组去重合并

合并数组我以为问的是一个数组插入到另外一个数组指定位置去，例如

var a = [1,2,3];
var b = [4,5,6];
//把b插入到a下标为1处
//a =  [1,4,5,6,2,3];

b = [1,0].concat(b);
a.splice.apply(a, b);

当时没有回答清楚，可能面试官只是想要合并数组方式concat而已。

面试最后

问了一下学历问题，面试官姐姐笑了一下，说不看重学校，超nice。

估计面试官姐姐对我很无奈，毕竟快一个小时了，中途还出现通话信号不好。通过面试，发现在基础知识点（我也只会这些基础，问我难得也不懂，Cry）上也存在好多问题，确实要好好改进，面试的时候，要经过大脑，不能脱口而出，重要的事情说三遍，要思考，要思考，要思考！

最后总结，对自身要求

1. 加强对程序的理解能力，向他人表达自己的思路。
2. 多写博客，也可以适当增加自己表达能力
3. 移动端的学习也要提上日程了
4. 前端的坑踩不完，但是遇到要深入理解一下。并记录下来。
5. 多阅读别人写的博客，增加自己视野。