口碑网前端工程师笔试有感 (附题)

口碑网前端工程师笔试有感 (附题)

今天本来是想去自修的..到了自修室门前发现口碑有个宣讲会..而且开始已经半个小时了..不过还是想去瞧瞧到底是咋回事..很荣幸..进去之后见到了秦歌..(不知道谁是秦歌的，点击这里)。和他聊了一会，请教了一些前端的问题，关于框架，关于oop，关于前端的发展方面的（因为现在大三..）。然后就试着去参加了笔试（一点准备都米有- -！）

可能口碑网当时没有想到会有这么多人来参加笔试，技术类试卷不够，所以我们被安排到了另外的教室等待笔试开始，因为技术类笔试都是混在一起的，也不知道有多少人是和我一起做前端笔试的。等了大概一个小时不到吧，试卷发下来了。大致的把题目给大家分享一下吧。

第一题(1)编写html，实现(2)说明你写的html的<document>类型(3)用json表示展示的数据我的代码

1. <ul>
    
2.     ….
    
3.     <li>
    
4.         <a href=”#”>
    
5.             <img src=”#” alt=”商店名”/>
    
6.             <p>外婆湾</p>
    
7.             <p>马市街130号9-9</p>
    
8.             <p>好评<em>62%</em>人均<em>55</em>元</p>
    
9.         </a>
    
10.     </li>
     
11.     ….
     
12. </ul>

复制代码

我还另外写了一种方案..不过觉得其实有点多余..所以还是不在这里写了
(2)让我蛋疼了，当时没想明白题目问的是什么..就随便写了一个tranditional和starderd mode…自己看看都觉得写得怪怪的..
(3)我写了
 

1. var shopInfo = {
    
2.     picSrc:图片链接,
    
3.     shopName:外婆湾,
    
4.     shopAdd:马市街130号6-9,
    
5.     goodAdPer:62,
    
6.     avPur:55
    
7. }

复制代码

第二个题目 具体我也不太记得了，就是考浮动，定位，块级元素和行内元素，还有css hack。叽里呱啦写了一堆
第三个题目鼠标事件-划入，点击，移出
写出事件注册函数
我的答案
 

1. mouseover click mouseout(当时脑子短路，想不起来mousemove)
    
2. function addEvent(el,type,fn){
    
3.     if(el.addEventListener){
    
4.         el.addEventListener(type,fn,false);
    
5.     }
    
6.     el.attachEvent(“on”+type,fn);
    
7. }

复制代码

这个地方有点蛋疼。。做到这里的时候前面有个红衣服哥哥开始盯着我做..然后慌了- -！（心里素质不行）
然后杯具滴忘了加上else if…
那个时候还是在考虑着如何在attachEvent之后把this指针指向el。。然后整整考虑了十多分钟…（最后还是没有想起来）
直接导致后面两题只剩15分钟时间做。
比较合理的是jR的事件注册，可惜用笔就是写不出来- -蛋疼
 

1. if(window.addEventListener){
    
2.   var fn = function (type,fn,useCapture){
    
3.     el.addEventListener(type,fn,useCapture);
    
4.   }
   
5. }else if(window.attachEvent){
    
6.   fn = function (type,fn){
    
7.     el.attachEvent(‘on’+type,);
    
8.   }
    
9. }

复制代码

第四题因为时间有点紧。。就蛋疼的开始乱涂乱画了
题目是用js写一段下拉菜单吧
 

1. var my = document.getElementById(“my”);
    
2. var ulDown = document.getElementById(“down”);
    
3. ulDown.style.display=”none”;
    
4. my.onmouseover = function(){
    
5.     ulDown.style.display=”none”;
    
6. };
    
7. my.onmouseout = function(){
    
8.     ulDown.style.display = “block”;
    
9. };

复制代码

回想起来我就蛋疼，当时太紧张了，直接犯了各种低级的错误（毕竟是有史以来第一次面试企业，也可以原谅，嘎嘎）
 

• hide和show顺序也搞错了
   

第五题

1. function Person(name){
    
2.     this.name = name;
    
3. }
    
4. Person.prototype={
    
5.     sayName:function(){
    
6.         alert(this.name);
    
7.     }
    
8. }
    
9. var man = new Person();
    
10. var jack = new man(“jack”);
     
11. jack.sayName()

复制代码

大致就这样一个题目，然后问jack.sayName输出什么，然后就是如果要输出jerry，改怎么写
这里我已经彻底脑残了..
prototype在博客里也分析了不少了..就是脑子短路..当然还有很大的原因就是掌握的不够..
写了划掉，划掉又写..蛋疼死了..
很快时间就到了，本来可以继续写的，但是觉得还是得按照规定来，所以抓紧时间写了点笔试感想当作答案了..
总结这次笔试收获还是很大的，也让我的继续学习有了目标。
谢谢淘宝提供的机会，也谢谢秦歌的指导
继续奋斗吧
明年我还会来的

【口碑网前端工程师笔试有感 (附题)】相关文章：

阿里在线前端笔试题08-04

阿里在线前端笔试题201508-03

搜狐笔试真题编程笔试真题07-23

Web前端开发笔试题集锦11-21

创新工场2014笔试算法题汇总附答案11-16

广本笔试真题02-14

联想笔试真题12-10

平安笔试群殴题11-19

联想笔试真题11-06

2017监理工程师考试仿真题（附答案）01-21