前端笔试题集合（二）
欢迎大家不吝赐教。
No.11
在CSS样式中常使用px、em两种长度单位，各有什么优劣，在表现上有什么区别？
答案：
px是像素，em是相对单位，em，在缩放查看网页时，能准确缩放文字。使用px作为尺寸时，部分浏览器中放大页面时，文字不会变大。
No.12
如果你现在使用的是 Google Chrome 或 Apple Safari，如何让 input 元素在默认情况下显示 “alipay WD Team”，而在光标移入后则显示空白？
答案：
<input id='test' type='text' placeholder='alipay WD Team' /> <script> document.getElementById('test').onfocus=function(){this.value=" "}; </script>
No.13
解释一下
alert(Function instanceof Object); alert(Object instanceof Function);
这个结果。
答案：
Object, Function, Array等等这些都被称作是构造“函数”，他们都是函数。而所有的函数都是构造函数Function的实例。从原型链机制的的角度来说，那就是说所有的函数都能通过原型链找到创建他们的Function构造函数的构造原型Function.protorype对象，所以：
alert(Object instanceof Function);// return true
与此同时，又因为Function.prototype是一个对象，所以他的构造函数是Object. 从原型链机制的的角度来说，那就是说所有的函数都能通过原型链找到创建他们的Object构造函数的构造原型Object.prototype对象，所以：
alert(Function instanceof Object);// return true
有趣的是根据我们通过原型链机制对instanceof进行的分析，我们不难得出一个结论：Function instanceof Function 依然返回true, 原理是一样的
1. Function是构造函数，所以它是函数对象
2. 函数对象都是由Function构造函数创建而来的，原型链机制解释为：函数对象的原型链中存在Function.prototype
3. instanceof查找原型链中的每一个节点，如果Function.prototype的构造函数Function的原型链中被查到，返回true
因此下面代码依然返回true
alert(Function instanceof Function);// still true
结论
1. 在JavaScript语言中，一切的一切都是对象，它们全部继承自Object. 或者说所有对象的原型链的根节点都是Object.prototype
2. 理解原型链机制在JavaScript中式如何工作的是非常重要的。掌握了它，不管一个对象多么复杂，你总能够轻而易举地将它攻破。
No.14：
//现有代码如下：
var foo = 1;
function main(){
alert(foo);
var foo = 2;
alert(this.foo)
this.foo = 3;
}
//1.请给出以下两种方式调用函数时，alert的结果，并说明原因。
var m1 = main();
var m2 = new main();
//2.如果想要var m1 = main()产生的m1和前面的m2完全一致,又该如何改造main函数?
答案：
1、var m1=main()时，alert的结果是undefined和1,原因是首先在alert(foo)的时候，foo在main()函数域内还没有被定义，因此提示undefined,而在输出this.foo时，因为此时的函数执行环境是全局域，相当于window.main()，因此this=window，所以this.foo=window.foo=1
var m2=new main()时,alert的结果是undefined和undefined，第一个undefined的原因与前面一种情况相同，而第二个提示undefined的原因是在这种情况下用new构造了一个main()的实例，因此执行环境发生了改变，不再是全局域，而是m2，因此此时的this=m2，因此this.foo=m2.foo，但是由于在alert(this.foo)时，m2中的this.foo还未被定义,因此提示undefined
2、若要m1=main()与前面的m2产生的效果一致，则main()函数要修改成为function main(){alert(foo);foo=undefined;alert(this.foo);}即可
No.15
写一段脚本，实现：当页面上任意一个链接被点击的时候，alert出这个链接在页面上的顺序号，如第一个链接则alert(1), 依次类推；
答案：
主要考的是循环中的闭包。
<a href="#">第一个链接</a> <a href='#'>第二个链接</a> <script> window.onload=function(){ var l=document.links.length for(var i=0;i<l;i++){ document.links[i].onclick=(function(x){ return function(){ alert(x+1); } })(i); } } </script>
No.16
有一个页面区块如图所示，请用符合语义化的标签书写HTML代码。
答案：
<h4>店铺动态评分<span>与同行业相比</span></h4> <ul> <li>描述相符：<a class="data" href="#"><em title="">4.8</em></a><span class="higher" title="">高于</span><em>16.14%</em></li> <li>服务态度：<a class="data" href="#"><em title="">4.8</em></a><span class="higher" title="">高于</span><em>13.32%</em></li> <li>发货速度：<a class="data" href="#"><em title="">4.8</em></a><span class="higher" title="">高于</span><em>29.57%</em></li> </ul>
No.17
(new Date).getTime() 和 +new Date() 都可以取到当前时间戳，它们的实现原理是什么，哪个效率更高？
答案：
第一种写法所耗的时间基本上只有第二种写法的一半，Date.getTime 发现这个函数本身实际上等价于valueOf，第一种方法实际上直接调用了valueOf ，而第二种方法涉及到JS内部的类型转换，尽管最终的结果也是调用了valueOf 函数，但是毕竟有个转换的过程，所以效率理应比前者要来的低下。
No.18
有哪些前端代码优化/性能优化的方法？
答案：
Yslow-23条规则
pagespeed
No.19
请列举所知道的css选择器，并说明怎么判断优先级？
答案：
- 标签名选择器，如：p{}，即直接使用HTML标签作为选择器。
- 类选择器，如.polaris{}。
- ID选择器，如#polaris{}。
- 后代选择器，如.polaris span img{}，后代选贼器实际上是使用多个选择器加上中间的空格来找到具体的要控制标签。
- 群组选择器，如div,span,img{}，群组选择器实际上是对CSS的一种简化写法，只不过把有相同定义的不同选择器放在一起，省了很多代码。
一般而言，选择器越特殊，它的优先级越高。也就是选择器指向的越准确，它的优先级就越高。
No.20
1.你了解arguments对象么,它有哪些属性?
2.arguments是数组么?如果不是请写一段代码将其转化为真正的数组,什么情况下需要这么做?
3.arguments有什么特性,可以用这些特性做什么?
function A(){ var Args = Array.prototype.slice.call(arguments, 0); B(Args.slice(1)); }
