騰訊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();