牛客网错题笔记(1)

1.问题:js加载html代码中的哪一部分,会导致页面在加载的时候自身被执行。
答案:body标签部分
解析:head标签是设计用于一些静态资源的预加载,与解析没有关系,浏览器会先加载head标签内的静态元素(css与js),这时候的js并没有被执行,而是被UI线程阻塞了,然后浏览器就开始构建DOM树,然后开始构建css dom树,(即题目中的加载页面),最后才会执行head中的js部分。
浏览器在解析body内的样式以及script标签的时候是串行的,就是说script标签内的代码会即时执行,然后再去解析下面标签的内联样式。
详细解析:在HTML body部分中的JavaScripts会在页面加载的时候被执行。
在HTML head部分中的JavaScripts会在被调用的时候才执行。
放在head中的JS代码会在页面加载完成之前就读取,而放在body中的JS代码,会在整个页面加载完成之后读取。
这就说明了,如果我们想定义一个全局对象,而这个对象是页面中的某个按钮时,我们必须将其放入body中,道理很明显:如果放入head,那当你定义的时候,那个按钮都没有被加载,可能获得的是一个undefind。
2.问题:要运用css动画,需要运用什么规则:
答案:keyframes
解析:要运用css动画,需要运用@keyframes规则和animation属性。
3.问题:自闭和标签有
答案:<br/>是换行 <hr/>是水平线 <img/>是图片文件
4.问题:嵌入在html文档中的图像格式可以是
答案:gif,bmp,jpg,png。gif和png图片格式特点体积小,bmp内存较大。
5.问题:alert(undefined == null)的输出结果是:
答案:true
解析:== 仅判断值是否相同,undefined和null是相同的,所以为true,===在判断值是否相同的同时还判断类型是否相同,undefined类型为undefined,null的类型为object,因此为false.
6.问题:js的基本数据类型有:
答案:string,boolean,number,undefined,null,es6新增了symbol.object为复合类型。
7.问题:有如下代码:

1
2
3
4
5
6
7
8
9
10
var a,b;
(function(){
alert(a);
alert(b);
var a = b = 3;
alert(a);
alert(b);
})();
alert(a);
alert(b);

输出是什么结果:
答案:undefined,undefined,3,3,undefined,3;
解析:以上代码等同于:

1
2
3
4
5
6
7
8
9
10
11
12
var a,b;//undefined
(function(){
var a;//undefined
alert(a);//undefined
alert(b);//undefined
b = 3;//3
a = b;//3
alert(a);
alert(b);
})();
alert(a);//undefined
alert(b);//3

要注意var a = b = 3的时候,a是局部变量,b是全局变量的赋值。
8.问题:number(null)上面的代码将返回:
答案:0
解析:空字符串,null,empty,0, Number([0]),N
number默认都会把他们转化成0,Number(undefined)会转换成NaN,
console.log(null == 0) 为false console.log(undefined == 0)为false
详细解析:
number的转换:
1.如果是boolean,true和false将转换成1和0
2.如果是undefined,转换成NaN,
3.如果是字符串则遵循如下规则:
a.字符串只包含数字(包含前面带正号或者负号,则将其转换成十进制数字,前导0会忽略)。011会变成11
b.字符串包含有效的浮点格式,则将其转换为相应的浮点数值,前导0会被忽略。
c。字符串包含十六进制格式,转换为相同大小的十进制数。//number(“01f”) = 31;
d.字符串是空的,转换成0,//number(“”) = 0
e.字符串包含除以上格式之外的字符,则将其转换为NaN,//number(“helloworld”) = NaN;
f.如果是数值,不用说当然返回什么
e.如果是对象,则调用对象的valueof()方法,然后依照前面的规则转换返回的值,如果转换的结果是NaN,
则调用对象的toString()方法,然后再次按照前面的规则转换返回的字符串值。
9.问题:下面的jsx语法,哪一个无法达到预期:
答案:在用class的时候,必须用className,class是js的关键字,会重复。
10.问题:js中,call和apply的描述,错误的是:
a.call和apply都属于function.prototype的一个方法。每个function都有call和apply.
b.两者传递的参数不同,call函数第一个参数都是要传入给当前的对象,apply不是。
c.apply传入的是一个参数数组,也就是将多个参数组合成一个数组传入。
d.call传入的则是直接的参数列表,call方法可将一个函数的对象上下文从初始的上下文改变为thisObj指定的新对象。
答案:b.
解析:call和apply作用相同,区别在于接收参数的方式不同,call方法中,传递给函数的参数必须逐个列举出来,使用apply方法时,传递给函数的是参数数组。

1
2
3
4
5
6
function add(c,d) {
return this.a + this.b + c + d;
}
var o = {a:1,b:2};
console.log(add.call(o,5,7));
console.log(add.apply(o,[10,20]));

转换成上下文对象。
11.问题:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var A = {n:4399};
var B = function () {
this.n = 9999;
}
var C = function () {
var n = 8888;
}
B.prototype = A;
C.prototype = A;
var b = new B();
var c = new C();
A.n++;
console.log(b.n);
console.log(c.n);

以上代码的输出是:
答案:9999 4400
解析:console.log(b.n)中,查找b.n是首先查找b对象自身是否有n属性,如果没有会去原型(prototype)上找,当执行var b = new B()时,函数内部this.n =9999(此时this指向b),所以返回的是b对象,b对象自身有n这个属性,
同理。当执行var c = new C()时,c对象没有自身的n属性,向上查找,找到原型(prototype)上的n属性,因为A.n++(所以此时对象中的n为4400)。所以返回4400.
12.问题:语句var arr = [a,b,c,d]执行后,可以得到最大值得是。
a.math.max(arr),b.math.max(arr[0],arr[1],arr[2],arr[3]),
c.math.max.call(Math,arr[0],arr[1],arr[2],arr[3])
d.math.max.apply(math,arr);
解析:math.max传入参数是任意数量的值,b是可以的,c中,call可以传入任意多个参数,d中apply第二个参数以数组的形式进行传递。
13.问题:下面哪种方式不能改变作用域链:
a.while,b.try catch,c.eval
答案:a
解析:while只在函数局部环境或者全局环境运行,并不会改变作用域链。
红皮书中提到,虽然执行环境的类型总共只有2中,全局和函数(局部),但还是有其他办法来延长作用域链的。
是因为有些语句可以在作用域链前部临时增加一个一个变量对象,该对象在代码执行完毕后会被移除,具体来说,就是执行流进入下列任何一个语句时,作用域链会加强。try catch这种的catch块,with语句。
详细解析:链接 emm 现在还看不懂
14.问题:下面代码存在几个变量没有被回收:

1
2
3
4
5
6
7
8
9
10
var i = 1;
var i = 2;
var add = function(){
var i = 0;
return function(){
i++;
console.log(i);
}
}();
add();

答案:3个。
解析:代码回收的规则如下:1。全局变量不会被回收 2。局部变量会被回收,也就是函数一旦执行完毕以后,函数内部的东西都会被销毁。3.只要被另外一个作用域引用就不会被回收。
这里有3个没有被回收。全局变量中的i,第二行会覆盖掉第一个,因此只有1个,第二个是add(),变量也不会被回收,它定义了一个匿名函数,并将它赋值给了add(),第三个就是闭包中的i,闭包中的局部变量也不会被回收,因此3个变量没有被回收。
15.问题:localStorage,sessionStorage和cookie的区别
解析:

特性 cookie localStorage sessionStorage
数据生命周期 一般由服务器生成,可设置失效时间,如果在浏览器端生成cookie,默认是浏览器关闭后消失 除非被清除,否则永久保存 仅在当前会话下有效,关闭页面或浏览器后被清除。
存放数据大小 4k左右 一般5MB 一般5MB
与服务器端通信 每次都会携带在HTTP头部中,如果使用cookie保存过多数据会带来性能问题 仅在客户端(即浏览器端)中保存,不参与和服务器的通信 仅在客户端(即浏览器端)中保存,不参与和服务器的通信
易用性 需要程序员自己封装,源生的cookie接口不友好 源生接口也可以接受,也可以自己封装,object和array有更好的支持 源生接口也可以接受,也可以自己封装,object和array有更好的支持

16.问题:下列哪个操作是W3C标准定义的阻止事件向父容器传递:
a e.preventDefault(); b e.cancelBubble = true; c c.stopPropagation(); d e.stopImmediatePropagation()
答案:c
解析:dom中的事件对象:
preventDefault(),取消事件默认行为,
stopImmediatePropagation,防止对事件流中当前节点中和后续节点中的事件侦听器处理,此方法会立即生效,并且会影响当前节点中的事件侦听器。 取消事件冒泡同时阻止当前节点上的事件处理程序被调用。

stopPropagation 防止对事件流中当前节点的后续节点中的所有事件侦听器进行处理,此方法不会影响当前节点的任何侦听事件
取消事件冒泡,对当前节点无影响。cancelBubble 取消事件冒泡。
returnValue() 取消事件默认行为。
17.问题:取得id为rapper中的全部项的集合:
答案:$(“#wrapper”).contents()
解析:$(“#wrapper”).children()//只沿着DOM树向下遍历单一层级,查询直接的子元素,而不管子元素的子元素。$(“#wrapper”).html()//返回的是dom结构,而不是集合。$(“#wrapper”).content()//返回集合。
$(“#wrapper”).find(“all”),并没有all这个元素。contents()方法获得匹配元素集合中每个元素的子节点,包括文本和注释,
find()方法获得当前元素集合中每个元素的后代,通过选择器,jquery对象或元素来筛选,html返回或设置元素内容,children()方法返回匹配元素集合中每个元素的子元素。添加可选参数可通过选择器进行过滤。
18.问题:运行以下程序:

1
2
3
4
5
6
7
8
9
10
11
<script>
var m = 1,j =k = 0;
function add(n){
return n = n + 1;
}
y = add(m);
function add(n){
return n = n + 3;
}
z = add(m);
</script>

y和z的最终结果是:
答案:4.4
解析:js里面没有函数重载的概念,在其他语言中,可以存在同名函数,只要传入的参数不同,java中可以重载。
在js中,定义了2个同名函数后,后面的函数会覆盖前面定义的函数,结合这道题,由于函数的声明会提升,所以函数的声明会提前,由于存在同名函数,所以后面的add会覆盖前面的add函数,所以两次调用add返回的值时相同的。y和z都是4
19.问题:浏览器中go(),back(),forward(),都代表什么
答案:length 返回浏览器历史记录列表中url的数量,back表示加载history列表中前一个url,forward表示加载history中下一个url,go表示加载History中的某个具体页面。
20.问题:css中的overflow属性定义:
答案:参数式scroll时,必会出现滚动条,参数式auto时,子元素内容大于父元素时出现滚动条,参数是visible时,溢出的内容出现在父元素之外,参数式hidden时,溢出隐藏。
21.问题:当margin-top,padding-top的值时百分比时,分别是如何计算的。
答案:相对最近父级块级元素的width,相对最近父级块级元素的width.
css百分比的参照问题:参照父元素宽度的元素:padding,margin,width,text-indent
参照父元素高度的元素:height 参照父元素属性:font-size,line-height,
特殊:相对定位的时候,top(bottom),left(right)参照的是父元素的内容区域的高度与宽度,而绝对定位的时候参照的是最近的定位元素包括padding的高度和宽度。
22.问题.br hr分别代表什么
解析:hr定义水平线,br定义换行,还有自闭和标签有br,hr,img,input,link
23.问题:下列事件哪个不是由鼠标触发的事件()
a.click b.contextmenu c.mouseout d.keydown
答案:d
解析:click是鼠标点击事件。contextmenu是当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件,onContextMenu = “return false”可得出禁止鼠标右键的操作。
mouseout事件会在鼠标指针移除指定的对象时发生。keydown事件会在用户按下一个键盘按键时发生,由键盘触发。
24.问题:

1
2
3
4
5
6
7
8
9
10
11
function A() {
this.do = function(){
return 'foo';
};
}
A.prototype = function() {
this.do = function(){
return 'bar';
}
}
var x = new A().do();

x的值是
答案:foo
解析:首先从自己的实例对象里面去找该属性,找到了就不会再向上继续的查找。a.prototype是原型链上,所以不会查找。所以返回foo
25.

1
2
3
4
var F = function(){};
Object.prototype.a = function(){};
Function.prototype.b = function(){};
var f = new F();

关于这段代码正确的结论是:
答案:F能取到a,不能取到b.
解析:所有普通对象都源于这个object.prototype对象,只要是对象,都能访问到a,而f通过new关键词进行函数调用,之后无论如何都会返回一个与F关联的普通对象(因为不是通过函数构造创建的对象,所以不是函数对象,也就取不到b了)。
f.instanceof object 是true,f.instanceof Function是false,由此可见用new操作符创建的f只是对象,所以只能继承于object.prototype.
26.问题:新窗口打开网页,用到以下哪个值()
答案:_blank
解析:

1
<a href = "http://www.baidu.com" target = "_blank">表示打开一个新的网页。

target值 说明
_blank 在新窗口中打开被链接文档
_self 默认,在相同的框架中打开被链接的文档
_parent 在父框架集中打开被链接的文档
_top 在整个窗口中打开被链接的文档
framename 在指定的框架中打开被链接文档

27.问题:boostrap中,一个元素需要在被打印的时候隐藏的是
答案:hidden-print
解析.visible-print-block -visilbe-print-inline -visible-print-inline-block浏览器隐藏,打印机可见,.hidden-print浏览器可见,打印机隐藏