腾讯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

时间: 2024-08-01 10:31:24

腾讯web前端开发工程师笔试题及答案的相关文章

(转)腾讯web前端开发的笔试题(记忆版)

面试职位的是web前端开发工程师.一小时的笔试题,一看全傻眼了.全都是网页设计和javascript的东西,悲剧了.做java的几百年不搞那东东了.现在凭记忆记录一些笔试题,本人亲面,拒绝网上的各种假题. 1.js中“5”+4=? 答案:54 2.js中void(0)=? 答案:undefined 3.js中NaN*4=? 答案:NaN 4.js中null*4.5=? 答案:0 5.js中alert(5*015===5.075)结果?原因? 6.js中13>>2=? -13>>2=

前端试题-2016年阿里前端开发工程师笔试题6,7,8题的解法

2016年阿里前端开发工程师笔试题(只有题,没有答案): http://www.cnblogs.com/sdgf/archive/2015/08/18/4740698.html 第6题:请在____处填写答案,从而达到题目的要求 var arr = [1, 2, 3, 4, 5]; var result = arr.sort(_______________________________).join("+"); console.log(result); 解答:在排序当中,如果需要按照某

分享一位WEB前端开发工程师面试题!!!

    今天在Q群里看到这样一则面试题!此技术题还可以.只围绕了HTML.CSS.JS这三个前端必备的技术,其它更多的知识没有提及.你全做对了,并不代表着什么.但你答不上来,那就代表着很多很多... [HTML && CSS] 1.Doctype? 严格模式与混杂模式-如何触发这两种模式,区分它们有何意义? doctype声明指示将使用哪一个文档类型定义(Document Type Definition DTD)来编写标记,DTD基本上就是个详细描述标记规则和语法的页面. doctype有

笔试-4399【2020校招】Web后端开发工程师笔试题(我又行了?然后一份面试通知都没有,我是真的菜啊。。。。)

感悟:两小时,单项选择15,问答8,编程3,论述5(大学规划,为什么选这个岗位等等,也占分) 单选:计算机网络偏多,然后就是一些基本知识点了: 好喜欢考这东西啊,下面答案是6,因为末尾有个'\0',我做错了....如果c[10]的话就是10 归并排序最坏情况(多分析一点最坏情况,因为最好情况都考烂了.....): 问答: TCP的三次握手和四次挥手,为什么是三次而不是两次,为什么是四次而不是三次 SQL建表(create table `user`(id int not null, user va

2014阿里巴巴WEB前端实习生在线笔试题

2014年3月31日晚,我怀着略微忐忑的心情(第一次在线笔试^_^!!)进行了笔试,阿里巴巴的笔试题共有10道,几乎包含了Web前端开发的各个方面,有程序题.有叙述题,时间非常紧张,只完成了大概6道题.下面把遇到的题目跟大家分享一下! 1. <pre name="code" class="html"><!doctype html> <html> <head> <style type="text/css&

Web前端开发工程师需要掌握哪些核心技能?

Web前端开发所涉及的内容主要包括W3C标准中的结构.行为和表现,那么这三项中我们需要掌握的核心技能是什么呢? 1.开发语言 HTML发展历史有二十多年,历经多次版本更新,HTML5和CSS3的出现又是一次革新.有些人认为前端开发要掌握的技能简单,不就是制作网页 嘛,其实不然,web前端需要掌握的核心语言xHTML+CSS+JavaScript,JavaScript作为最难的语言之一,许多编程高手也不敢妄 自菲薄自封精通.由于JavaScript与html的差异性,以及静动态分开处理的一些好处.

Web前端开发工程师养成计划【转载】

Web前端开发工程师养成计划(入门篇) 最原始的忠告:这个世界上有想法的人很多,但是有想法又能实现它的人太少! 首先要感谢伟大的Web2.0概念.产品概念.用户体验概念.jQuery插件,是它们在中国日渐成熟才解放了一直以来姥姥不疼舅舅不爱的前端开发工程师们. 有没有发现从09年下半年到现在全中国的互联网公司都在招聘前端开发工程师?如果你注意到了,那么恭喜你,你已经拥有那么一点点预测互联网职场动向的能力. 可能令你感到遗憾的是你从没从事过前端开发工作,不过没关系,只要你肯努力,一切都是可以学会的

我也想成为一名出色的web前端开发工程师

随着互联网的发展,正式的前端工程师角色被行业认可,到了2010年,互联网开始全面进入移动时代,前端工程师的地位越来越重要,前端领域的技术发展也越来越快,各种新的思想.设计模式.工具和平台都快速发展,对前端工程师的技能要求也越来越高. 何为前端工程师?前端工程师,也叫Web前端开发工程师.他是随着web发展,细分出来的行业.它要求前端开发工程师不仅要掌握基本的Web前端开发技术,网站性能优化.SEO和服务器端的基础知识,而且要学会运用各种工具进行辅助开发以及理论层面的知识,包括代码的可维护性.组件

麦子学院-Web前端开发工程师系列培训教程

HTML+CSS基础入门1.课程介绍2.html的语法3.html的基本结构4.html的文档设置标记上(格式标记)5.html的文档设置标记下(文本标记)6.html图像标记img7.html超链接的使用8.html表格相关的标记9.html表格实战<简单的网页布局>10.html框架详解与框架布局实战11.HTML表单设计(上)12.HTML表单设计(下)13.使用CSS样式的方式14.定义CSS样式(CSS选择器)15.CSS常用属性(颜色属性)16.css常用属性(字体相关属性)17.