面试总结

今天去一家互联网公司面试前端开发工程师的职位，从下午两点一直聊到五点，整整三小时，两轮技术，一轮人力。

第一轮面试
持续了大约一个小时，主要面的是前端技术，涵盖了javascript、css、html以及设计模式相关的一些内容。
javascript部分，主要包括闭包、作用域链、继承、原型、封装、模块化、MVC、ajax以及跨域等等。问得比较深入，问到继承的时候直接让我写代码，写一段继承的代码，然后说说为什么会继承，继承是怎么实现的，我写了一个最基本的原型继承，指出原型继承的根本并不是prototype而是__proto__，并且画出了继承链的关系指向图，代码如下：

 1 function Foo(name){
 2     this.name = name;
 3 }
 4 Foo.prototype.getName = function(){
 5     console.log(this.name);
 6 }
 7 var f = new Foo(); // 实例化父类
 8 
 9 function Bar(){}
10 Bar.prototype = f; // 当仅需要父类的prorotype方法而不需要继承父类构造函数时如下：Bar.prototype = Foo.prototype;
11 Bar.prototype.constructor = Bar; // 维护子类自己的原型链
12 
13 var b = new Bar(); // 实例化子类

画得图如下：

 

在问到js如何封装一个私有变量的时候，引出了闭包的原理；后面问了一些关于作用域链查找的问题，这一块没有深入的问，仅仅只是说了下查找顺序的问题，先找局部的变量然后顺着作用域链一级一级往上查找直至全局变量；在跨域这一块，我着重介绍了document.domain+iframe跨域的方式，具体的做法是可以在http://www.test.com/foo.html和http://img.test.com/bar.html两个文件中分别加上document.domain = 'test.com'；然后通过foo.html文件中创建一个iframe，去控制iframe的contentDocument，这样两个js文件之间就可以"交互"了，这种办法只能解决主域相同而二级域名不同的情况；临场还给我出了两个编程题，一个是在一个字符串中找出出现最多的那个字符以及这个字符出现的次数，要求只能出现一次循环，我的答案如下：

 1 var s = 'asdasadfcxvxcvrtrtasdasd',
 2     tmp = {},
 3     ret = {
 4         str: '',
 5         count: 0
 6     };
 7 for(var i = s.length - 1; i >= 0; i--){
 8     if(tmp[s[i]]){
 9         tmp[s[i]] += 1;
10     }else{
11         tmp[s[i]] = 1;
12     }
13     if(tmp[s[i]] > ret.count){
14         ret = {
15             str: s[i],
16             count: tmp[s[i]]
17         }
18     }
19 }
20 console.log(ret);

另一个是实现一个对象的深复制，这个比较简单，注意引用类型就可以了，主要是递归的思想，代码就不贴了。

 

接下来他问我了一些设计模式方面的东西，并要我大致的实现一个观察者模式以及观察者模式在实际开发中的作用，这个地方我就用js里常用的一个自定义事件作为例子来实现了一次观察者模式。

 

最后又问到了一些html以及css方面的知识，这方面不是我的强项，所以答得不好，快到3点的时候，第一轮就结束了，由于html和css那部分我几乎全答错了，所以我觉得没戏了，但是面试官要我等一会，他去叫另一位面试官开始第二轮面试。

 

 

第二轮面试

第二轮面试就不是只偏向于前端技术了，问得比较发散。我之前做过一些物理游戏的小游戏，他就从这里入手，要我着重介绍了一下怎么实现动画、碰撞、反弹等等。接下来他要我实现一个模拟真实世界的物理引擎，大致的说下思路，后来他要我大致实现，但由于我物理比较差，一些关于物理的公式没记住，鼓捣半天没弄出来，后来面试官给我降低了点难度，就直接要我实现一个步长逐渐减少的一个动画效果，这个我给实现了，代码很简单（大致写的），这里就不贴了；接下来他问我一个jsonp的缺点是什么，这个问题我一下子就蒙了，平时都只是关注jsonp的优点，也没注意缺点啥的。。说了一堆不是他想要的答案，最后他告诉我了。。。原来他想听到的是jsonp只支持get请求，也就是说发起jsonp请求的参数只能通过url地址来传递，这里一定要记住了。。接着问了我一些页面优化方面的访问，在回答这个问题的时候，我说了ajax的缓存，用自定义对象来做ajax的缓存，这个答案引出了下一道编程题，设计一个结构并写出方法，来实现缓存5个ajax请求，最多只能存5个，接着再存的话则要把最先存入的从这个数据结构里面删掉，要求不管是把缓存放入到这个结构还是从这个结构中取出缓存，都不能使用循环，我的代码如下：

 1 var cache = {
 2     maxCount: 0,
 3     tmp:[]
 4 }
 5 
 6 var setCache = function(key, content){
 7     if(cache.maxCount < 5){
 8         cache[key] = content;
 9         cache.tmp.push(key);
10         cache.maxCount += 1;
11     }else{
12         cache[key] = content;
13         cache.tmp.push(key);
14         var o = cache.tmp.shift();
15         delete cache[o];
16     }
17 }
18 
19 var getCache = function(key){
20     return cache[key];
21 }

接下来要我写出发起一次http请求完整的流程，这一块懂的不是那么多，就把我知道的都写进去了，域名解析、握手、服务器端处理、gzip压缩等等，都写进去了。差不多这一面就结束了。

 

 

第三轮面试

主要就是人力了，问了一些常见的问题，为什么离职，个人职业规划，对未来的发展，对薪酬的要求等等。

 

 

总的来说，今天的面试我个人比较满意，不管成功与否，至少这次面试已经把我现在阶段的能力展现出来了，临场发挥写代码也还可以，总体来说比较满意。当然，缺点也很多，以后得恶补一下html、css、算法方面的知识了。加油！！

转载于:https://www.cnblogs.com/ielgnaw/archive/2013/04/10/3013301.html