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

时间 2019-11-06

标签腾讯 web 前端开发工程师笔试答案栏目腾讯繁體版

原文原文链接

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

一、如何实现事件委托？css

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

考虑一个列表，在li的数量很是少的时候，为每个li添加事件侦听固然不会存在太多性能方面的问题，可是当列表很是的长，长到上百上千甚至上万的时候（固然只是一个解释，实际工做中不多遇到这么多li的状况），为每一个li添加事件侦听就会对页面性能产生很大的影响。前端

就像下面这段代码：java

<!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>web

首先，咱们来想下，产生性能问题的根本缘由是什么呢？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>性能优化

虽然如今不少框架都已经实现了事件委托，可是做为一个开发人员，用框架的同时咱们也应该知道他实现的原理是如何的，知其然，更要知其因此然

二、将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;

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

运算符	描述
. [] ()	字段访问、数组下标、函数调用以及表达式分组
++ -- - ~ ! delete new typeof void	一元运算符、返回数据类型、对象建立、未定义值
* / %	乘法、除法、取模
+ - +	加法、减法、字符串链接
<< >> >>>	移位
< <= > >= instanceof	小于、小于等于、大于、大于等于、instanceof
== != === !==	等于、不等于、严格相等、非严格相等
&	按位与
^	按位异或
\|	按位或
&&	逻辑与
\|\|	逻辑或
?:	条件
= oP=	赋值、运算赋值
,	多重求值

四、 typeof(null)=______

答案为object

五、 JS中给所有都是数字元素的数组排序的原生方法是___sort_______，其中使用的是__冒泡__排序方法。

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

详细说明访问网站：

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

六、 NaN * 6=__NaN____

七、 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个参数的函数

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

第1个参数为:ooooo

以上是用arguments来得到参数

下面用变量来得到参数:

p1:ooooo

p2:undefined

八、软件HttpWatch的做用？

能够参考：http://baike.baidu.com/view/425789.htm

九、 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'); // 关闭缓存