2009暑期实习生-电子商务事业部web前端笔试题
Post by
yaohuaq
  2009-06-05 05:17:01 Friday Tags:暑期,实习,笔试

申请的是运维部_PHP实习开发工程师，系统却给了web前端笔试题，MD，答得一塌糊涂的~，反正是没戏了，下面是题目，有兴趣的来看看，做一做了。

提示：写出你认为最优的答案，若写不出具体代码，也请将解题思路写明
1．某产品页面左侧的边栏是一个允许用户自定义宽度（240-420像素）的div容器，现在设计师考虑在容器内放置一个8 X 8格的国际象棋棋盘，棋盘的总宽度是一个偶数，而同时，为了良好的视觉效果，必须保证容器两边所留的空白宽度相同。于是，Web前端开发工程师A现在面临一个难题了，那就是如果用户设置的容器宽度为奇数，必须在页面渲染的时候，将它的实际宽度减少一个像素变为一个偶数。仔细考虑之后，A决定用他所精通的JavaScript来实现一个函数f，这个函数的参数是一个正整数，返回值是一个最接近且不大于这个正整数的偶数，例如f(240)返回240，f(311)返回310。A很快写出了这个函数：

JavaScript代码
  1. function f(n){  
  2. if(n % 2) return n-1;  
  3. return n;  
  4. }   


当A的同事C仔细研究了这个函数之后，指出其实还有更高效率的写法。
(1.a) 问题：如果您是C，您将如何改良这个函数呢？


2．在休息室里，A给大家讲了一道经典的微软面试题，题目是这样的：对于给定的一个字节表示的无符号整数，求将它表示成二进制之后，“1”出现的次数。例如5=101(2)->2，11=1011(2)->3……C说这道题很容易，只需要用一个简单的function就能实现：

JavaScript代码
  1. function (n){  
  2. if(typeof n != “number” || n <= 0) return 0;  
  3. var count = 0;  
  4. while(n){  
  5.   count += n & 0x1;  
  6.   n >>= 1  
  7. }  
  8. return count;  
  9. }   


当C写出他的答案之后，A说，是的，这是解法之一，不过这样的效率仍然不够高，实际上我有更高效率的解法：

JavaScript代码
  1. function (n){  
  2. if(typeof n != “number” || n <= 0) return 0;  
  3. var count = 0;  
  4. while(n){  
  5.    n &=  (n-1);  
  6.   count++;  
  7. }  
  8. return count;  
  9. }   


(2.a) 问题：为什么A说自己的解法效率比C的解法要高？
C看了A的解法，说道，这个办法确实高明。A说，针对这道题其实还有其他解法，比如查表法，因为只有8位，所以是可以考虑的，当然位数多了的话，查表法就不适合了。这时候，C忽然想到了什么，对A说，我想到了一种JavaScript特有的解法，不用循环，多于8位也适用，效率还比较高。
(2.b) 问题：请问您想到类似这样的解法了吗？请给出您的解题思路。


3．让页面元素可拖动是一种常用脚本实现的交互方式。基本的拖动是用鼠标点住某个元素在一个特定的可见区域内移动。现在A遇到的一个问题是在可拖动区域内有一个椭圆形的禁区，如下所示：
    ------------------------------------------------------
    可拖动区域
                                                        
                                           （椭圆禁区）

                                              
    -------------------------------------------------------

已知禁区的外接矩形的左上角坐标为（left，top）、宽高为（width，height）。A打算写个函数，用来判断鼠标是否位于禁区内。
(3.a) 问题：这个函数该如何实现呢？
C提醒A说这个交互比想象中复杂，需要考虑很多细节问题。
(3.b) 问题：如果您是A，实际要实现这个交互，您认为需要考虑哪些细节问题？


4．糊涂的A不小心把一个设计好的页面弄乱了，现在这个页面上有若干绝对定位的div，这些div有确定的左上角（top、left）和宽高（width、height），页面初始化后，这些div的位置有可能重叠（如果两个div有任意部分相交，就认为这两个div重叠）。

这种界面被人看到可就惨了，然而弄乱的div数量如此之多，A不得不用JavaScript实现一个function，这个function检查页面上所有绝对定位的div，输出一个包含重叠的div组合的数组。（如果DIV1与DIV2相交、DIV3、DIV4、DIV5两两相交、DIV6与DIV7相交，那么输出结果为[[DIV1,DIV2],[DIV3,DIV4,DIV5],[DIV6,DIV7]]）
(4.a) 问题：如果您是A，您将怎样实现这个function？


5．设计师交给A去实现一个布局，这个布局由三列等高的区域组成，左栏的宽度为40%-102px，中栏的宽度为200px，右栏的宽度为60%-102px。左中栏、右中栏之间的间隔均为2px。
一开始A觉得实现这样的布局根本不用花费什么功夫，可是具体实现的时候，却发现远没有想象中那么简单。Web标准、浏览器兼容性……各种需要考虑的细节都让A觉得自己陷入了麻烦之中。
(5.a) 问题：如果您是A，您将怎样实现这个布局？


6．请回顾您以往经历过的前端开发项目，谈谈您认为最能体现您前端开发水平的精彩部分。

 

评论:
发表评论:
姓名：
联系方法:(选填)
评论内容:
个人信息
迎接
昵称:C7_yaohuaq
QQ:88523499
Email:c77cc#vip.qq.com
居住地:北京 海淀
星座:天蝎
毕业院校:广西民族大学
工作点:喜讯无限