码迷,mamicode.com
首页 > Web开发 > 详细

腾讯web前端开发工程师笔试题及答案

时间:2014-07-29 22:12:14      阅读:625      评论:0      收藏:0      [点我收藏+]

标签:style   http   java   color   使用   io   数据   for   

腾讯web前端开发工程师笔试题及答案

1、 如何实现事件委托?

首先要知道什么是事件委托。

考虑一个列表,在li的数量非常少的时候,为每一个li添加事件侦听当然不会存在太多性能方面的问题,但是当列表非常的长,长到上百上千甚至上万的时候(当然只是一个解释,实际工作中很少遇到这么多li的情况),为每个li添加事件侦听就会对页面性能产生很大的影响。

就像下面这段代码:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>js性能优化</title>
</head>
<body> 
<ul id=‘list‘>
<li>精通css</li>
<li>精通js</li>
<li>精通html</li>
......
</ul>
</body>
</html> 
<script type="text/javascript">
(function(){
var a=document.getElementById(‘list‘);
var b=a.getElementsByTagName(‘li‘);
for(var i=0;i<b.length;i++){
b[i].addEventListener(‘click‘,function(e){
var c = e.target; 
alert(c.innerHTML);
},false);
}

})();
</script>

首先,我们来想下,产生性能问题的根本原因是什么呢?li元素(目标对象)所要进行的事件处理了。怎么可以解决这种囧况呢?

答案就是采用事件委托,将在li对象上面要处理的事件委托给父元素或者祖先元素,即为父元素绑定事件侦听,

看看下面的改进代码:

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8" />
<title>js性能优化</title>
</head>
<body> 
<ul id=‘list‘>
<li>精通css</li>
<li>精通js</li>
<li>精通html</li>
......
</ul>
</body>
</html> 
<script type="text/javascript">
(function(){
var a=document.getElementById(‘list‘);
a.addEventListener(‘click‘,function(e){
var b = e.target; 
alert(b.innerHTML);
},false);
})();
</script>

 虽然现在很多框架都已经实现了事件委托,但是作为一个开发人员,用框架的同时我们也应该知道他实现的原理是如何的,知其然,更要知其所以然

 

2、 10进制的数302转为二进制。

十进制转二进制的原理是:  

2辗转相除至结果为1  

将余数和最后的1从下向上倒序写 就是结果  

例如302  

302/2 = 151 0  

151/2 = 75 1  

75/2 = 37 1  

37/2 = 18 1  

18/2 = 9 0  

9/2 = 4 1  

4/2 = 2 0  

2/2 = 1 0  

故二进制为100101110 

所以程序可以写成这样:

var a=302;

var str="";

while(a>1){

str = a%2 + str;

a = parseInt(a/2);

}

str = a+str;

 

3、 js中运算符的优先级(此非原题,为原理题)

运算符

描述

. [] ()

字段访问、数组下标、函数调用以及表达式分组

++ -- - ~ ! delete new typeof void

一元运算符、返回数据类型、对象创建、未定义值

* / %

乘法、除法、取模

+ - +

加法、减法、字符串连接

<< >> >>>

移位

< <= > >= instanceof

小于、小于等于、大于、大于等于、instanceof

== != === !==

等于、不等于、严格相等、非严格相等

&

按位与

^

按位异或

|

按位或

&&

逻辑与

||

逻辑或

?:

条件

= oP=

赋值、运算赋值

,

多重求值

 

 

4、 typeof(null)=______

答案为object

 

5、 JS中给全部都是数字元素的数组排序的原生方法是___sort_______,其中使用的是__冒泡__排序方法。

例如:array.sort(function(a,b){return a-b;})

详细说明访问网站:

http://www.admin5.com/article/20120718/445724.shtml

 

6、 NaN * 6=__NaN____

7、 JS中调用某个函数之前,如何取得该函数最多可以传递多少个参数?该函数被调用时,如果知道传了多少个参数过来?

假设函数名为fun,那个fun.length就是它最多能接受的参数个数;

fun函数里面,arguments就是用数组装着调用时传过来的所有参数,因此arguments.length就是已经传递过来的参数个数;

如:

 

function  needTwoPara(p1,p2){

var a=arguments;

    var result=‘我是个需要‘+needTwoPara.length+‘个参数的函数\n‘

        +‘您输入的参数的个数为:‘+a.length+‘\n‘

    for(var i=0, len = a.length; i < len; i++){

        result=result+‘‘+(i+1)+‘个参数为:‘+a[i]+‘\n‘

    }

    result+=‘以上是用arguments来获得参数\n‘;

    result+=‘下面用变量来获得参数:\n‘;

    result+=‘p1:‘+p1+‘\n‘;

    result+=‘p2:‘+p2+‘\n‘;

    alert(result);

}

alert(needTwoPara.length);

needTwoPara(‘ooooo‘);

 

运行结果为:

2

 

我是个需要2个参数的函数

您输入的参数的个数为:1

1个参数为:ooooo

以上是用arguments来获得参数

下面用变量来获得参数:

p1:ooooo

p2:undefined

 

8、 软件HttpWatch的作用?

可以参考:http://baike.baidu.com/view/425789.htm

 

9、 JS如何得到HTTP的请求头信息和返回的头信息?

Javascript中跟response header有关的就两个方法:

getResponseHeader 从响应信息中获取指定的http头 语法
strValue =
oXMLHttpRequest.getResponseHeader(bstrHeader);
getAllResponseHeaders 获取响应的所有http头 语法
strValue =
oXMLHttpRequest.getAllResponseHeaders();

需要注意的是,通常,在IE下不能完整的获取header报头数据,只能取到如下header数据:

X-Powered-By:
X-UA-Compatible:
Keep-Alive:
Transfer-Encoding:
Content-Type:
比如你要获取时间戳,在IE下必须做些特殊处理,需要在后端设置一下,关闭缓存:

  

1. header( ‘Cache-Control: no-store‘); // 关闭缓存

 

腾讯web前端开发工程师笔试题及答案,布布扣,bubuko.com

腾讯web前端开发工程师笔试题及答案

标签:style   http   java   color   使用   io   数据   for   

原文地址:http://my.oschina.net/u/1866565/blog/295995

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!