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

本文整理了2015年阿里巴巴前端实习生在线笔试的部分题目,包括选择题和实践题,涉及JavaScript、DOM事件流、元素获取等多个方面,旨在帮助理解和复习前端知识点。
摘要由CSDN通过智能技术生成

已经很久没有在CSDN上面写博客了,最近发现CSDN也可以用Markdown了,小小地兴奋了一下,决定写一篇博客第关于前几天2015阿里巴巴前端实习生在线笔试的。前几天参加了这个在线笔试,发现题目真的挺难的,后来再重新回想的时候,除了本来就不会做的,还发现自己做错了几道题,现在整理一下那些笔试题,这里的笔试题部分是自己的,也有部分是工作室其他小伙伴们提供的。感谢楷豪师兄和闻东师兄的相关指导,感谢工作室其他小伙伴们提供的题目和答案。下面选择题给出的一些解析和答案都是自己上网查过相关资料然后根据自己的理解给出的,不保证全部正确哈,仅作参考作用。
这篇文章的github地址


一、(单项选择)对于下列程序运行结果,符合预期的是

function f1() {
   

    console.time('time span');

}
function f2() {
   

    console.timeEnd('time span');

}

setTimeout(f1, 100);

setTimeout(f2, 200);

function waitForMs(n) {
   

    var now = Date.now();

    while (Date.now() - now < n) {}

}

waitForMs(500);
  • A、time apan:700.077ms
  • B、time apan:0.066ms
  • C、time apan:500.077ms
  • D、time apan:100.077ms

解析:
console.time()语句和console.timeEnd()语句是用来对程序的执行进行计时的。因为f1f2被都setTimeout()事先设置的定时器装到一个事件队列里面。本来f1应该在100ms后就要执行了,但是因为waitForMs()占用了线程,而执行JavaScript是单线程的,所以就没办法在100ms后执行那个f1,所以需要等500ms等waitForMs()执行完,然后再执行f1f2,这时候f1f2就几乎同时执行了。所以应该选时间最短的一项,所以答案应该选B (楷豪师兄提供的解答)


二、(单项选择)请选择结果为真的表达式

  • A、null instanceof Object
  • B、null == undefined
  • C、NaN == NaN
  • D、false == undefined

解析:
A、未定义的值和定义未赋值的为undefined,null是一种特殊的object,所以typeof null 返回的应该是object,但是为什么null instanceof Object返回的是false呢?原因就是null是个特殊的Object类型的值 ,表示空引用的意思 。instanceof 表示某个变量是否是某个对象的实例 ,所以为false
B、undefined == null是正确的,尽管如此,和其他相似之处,但nullundefined并不是等价的。每个作为其独特的类型的唯一成员,undefinedUndefined类型和nullNull类型。所以undefined === null是不正确的,因为他们虽然值相等,但是类型不相等。区分这两个值,可以认为undefined代表一个意想不到的没有值而null作为预期没有值的代表。
(null:)是一个对象,但是为空。因为是对象,所以typeof null返回objectnullJavaScript保留关键字。
null参与数值运算时其值会自动转换为0,因此,下列表达式计算后会得到正确的数值:
表达式:123 + null 结果值:123
表达式:123 * null 结果值:0
(undefined:)是全局对象(window)的一个特殊属性,其值是未定义的。但typeof undefined返回undefined
C、NaN是一个值类型,同是也是一个数值.意思是Not A Number,这个都知道是什么意思.值比较特殊,特殊在于NaN是一个数字,是一个与任何数值都不相等的数字。所以NaN == NaN返回false
D、undefined被转换为布尔值为falseBoolean(undefined)返回的是false,但是undefined不等于false。所以false == undefined返回false
所以最终答案应该为B


三、(单项选择)下面程序的执行结果是

var name = 'World!';
(function () {
   
  if (typeof name === 'undefined') {
    var name = 'Jack';
    console.log('Goodbye ' + name);
  } else {
    console.log('Hello ' + name);
  }
})();
  • A、Goodbye Jack
  • B、Hello Jack
  • C、Hello undefined
  • D、Hello World

解析:
因为JavaScript中的变量的查找是就近原则去寻找var定义的变量,当就近没有找到的话就会找外层。题目中因为if判段语句(typeof name === 'undefined')就近定义的name就在其执行完的下一行,所以name就被预解析了,实际上可以理解成在if判段语句(typeof name === 'undefined')上面var name这样定义了name,但是尚未被赋值。而在它执行完后面再去为name赋值name = 'Jack';,所以name的值是undefined。所以typeof name === 'undefined'成立,所以判断语句会走if成立部分。
所以最终答案应该为A


四、(不定项选择)以下关于DOM事件流的表述哪些是正确的

  • A、事件流包括两个阶段:事件捕获阶段、事件冒泡阶段
  • B、IE跟标准浏览器对于DOM事件流实现不一样
  • C、假设parentEle是childEle的父节点,绑定事件:parentEle.addEventListener(“click”, fn1, false)和childEle.addEventListener(“click”, fn2,false),当点击childEle的时候fn1将先于fn2触发
  • D、addEventListener第三个参数true代表支持捕获,false代表不支持捕获

解析:
W3C事件模型中,任何事件会首先被捕获直至到达目标元素然后再冒泡回去。事件流包括3个阶段:事件捕获阶段处于目标阶段事件冒泡阶段。所以A选项是的。Web开发者可以选择将事件处理程序注册在捕获或者冒泡阶段。这可以通过addEventListener()方法来实现。如果该方法传入的最后一个参数值为true,表示事件处理程序被注册在捕获阶段,如果为false表示件处理程序被注册在冒泡阶段。所以D选项也是的。
假设有如下程序(childEleparentEle的子元素):
1.parentEle.addEventListener("click", parentDoSomething, true);
2.childEle.addEventListener("click", childEleDoSomething, false);
如果用户点击子元素childEle会发生如下事情:

a、点击事件开始于捕获阶段。它会先查询是否有childEle的任何祖先元素在捕获阶段绑定了onclick事件。
b、它发现祖先元素1在捕获阶段绑定了onclick事件,于是parentEle.parentDoSomething()首先被执行。
c、事件一直查询到目标元素childEle都没有再发现别的在捕获阶段绑定的onclick事件,事件转到它的冒泡阶段并执行childEleDoSomething()(注册在childEle上的在冒泡阶段执行的事件处理程序)。
d、事件再次向上查询并检查是否有任何祖先元素在冒泡阶段绑定了onclick事件,并没有查询到,所以什么都没有发生。

再看相反的例子:
1.parentEle.addEventListener("click", parentDoSomething, false);
2.childEle.addEventListener("click", childEleDoSomething, false);
现在如果用户点击childEle,下面的事情会按顺序发生:

a、点击事件发生于捕获阶段。事件查询childEle是否有任何祖先元素在捕获阶段绑定了onclick事件并且没有查找到这样的元素。
b、事件查询到目标元素childEle自己。事件转为冒泡阶段并执行childEleDoSomething()
c、事件再次向上查询并检查目标元素是否有任何祖先元素在冒泡阶段绑定了onclick事件。
d、它找到了满足条件的parentEle,然后执行parentDoSomething()。所以选项C的,应该是fn2先触发。

因为IE没有提供对事件捕获阶段的支持,所以IE标准浏览器对于DOM事件流实现不一样。
所以最终答案应该为B


五、(不定项选择)通过下面的哪些方法可以获取页面的html元素

  • A、document.getElementById
  • B、document.getElementsByClassName
  • C、document.querySelector
  • D、document.querySelectorAll

解析:
A、页面的html元素可以通过id获取,具有唯一性,如:var divObjId = document.getElementsById("test");。所以A是正确的。
B、页面的html元素可以通过class获取,会选择页面上所有class名为test的所有元素,返回的对象是NodeList。如:var divObjClass = document.getElementsByClassName("test");。所以B是正确的。
C、D 、document.querySelector只返回匹配的第一个元素,如果没有匹配项,返回nulldocument.querySelectorAll返回匹配的元素集合,如果没有匹配项,返回空的NodeList(节点数组)。这两个方法都可以接受三种类型的参数:id(#)class(.)标签,很像jquery的选择器。如:

var obj = document.querySelector("#id");
var obj = document.querySelector(".classname");
var obj = document.querySelector("div");
var el = document.body.querySelector("style[type='text/css'], style:not([type])");
var elements = document.querySelectorAll("#score>tbody>tr>td:nth-of-type(2)");
var elements = document.querySelectorAll("#id1, #id2, .class1, class2, div a, #list li img");

所以CD都是正确的。
所以最终的答案是A,B,C,D


六、(不定项选择)下面选项中,对javascript事件的描述不正确的是

  • A、IE使用attachEvent/detachEvent方法来添加和删除事件监听器;w3c使用addEventListener/removeEventListener方法
  • B、IE是将event对象作为参数传递给监听器,w3c事件监听器内使用的是一个全局的Event对象
  • C、IE提供了对事件捕获阶段的支持
  • D、要停止事件的传递,IE的做法是设置event对象的cancelBubble为true,而w3c的做法是设置执行stopPropagation方法

解析:
A、IE使用attachEvent/detac

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值