前端试题大综合练习（三）

1、请实现方法parse，作用如下：

var object = {

 b: { c: 4 }, d: [{ e: 5 }, { e: 6 }]

};

console.log( parse(object, ‘b.c’) == 4 ) //true 

console.log( parse(object, ‘d[0].e’) == 5 ) //true

console.log( parse(object, ‘d.0.e’) == 5 ) //true

console.log( parse(object, ‘d[1].e’) == 6 ) //true

console.log( parse(object, ‘d.1.e’) == 6 ) //true

console.log( parse(object, ‘f’) == ‘undefined’ ) //true

答案：

var parse=function(obj,str){
if (!str||!str.length) {
return '';
}
str.replace('[','.').replace(']','').split('.').map(item=>obj=obj[item.trim()]);
return obj||'undefined';
}

说明：重点研究！！！

2、现有如下html结构

<ul>

 <li>click me</li>

 <li>click me</li>

 <li>click me</li>

 <li>click me</li>

</ul>

运行如下代码：

var elements=document.getElementsByTagName('li');

    var length=elements.length;

    for(var i=0;i<length;i++){

        elements[i].onclick=function(){

        alert(i);

    }

 }

依次点击4个li标签，哪一个选项是正确的运行结果（）?

A、依次弹出1，2，3，4

B、依次弹出0，1，2，3

C、依次弹出3，3，3，3

D、依次弹出4，4，4，4

答案：D

说明：这题是一个陷阱，主要考的是闭包问题。只有for循环i运行到最大值时才执行点击事件，所以每次点击弹出都是4，函数中弹出的i其实是父级作用域中的i，要想达到弹出0,1,2,3，必须将参数i传进去：

for(var i=0;i<length;i++){

        elements[i].onclick=function(num){
return function(){
alert(num);
}；

    }(i);
闭包只能取得包含函数中任何变量的最后一个值。闭包所保存的是整个变量对象，而不是某个特殊的变量。

在调用匿名函数时，我们传入变量i，由于参数是按值传递的，所以就会将变量i的当前值复制给参数num。而这个匿名函数内部，又创建并alert了一个访问num的闭包。这样，每一次点击都有num变量的一个副本，因此可以返回各自不同的数值。

3、在HTML页面中，包含id为”div1”的层，下列选项中的JavaScript代码可以使该层显示（）

A、document.getElementByName(“div1”).style.display=”visible”;

B、document.getElementById(“div1”).style.display=”none”;

C、document.getElementByName(“div1”).style.display=”hidden”;

D、document.getElementById(“div1”).style.display=”block”;

答案：D

4、关于offsetleft和style.left说法中正确的是（）

A、offsetleft返回的是字符串，style.left返回的是数值

B、style.left是读写的，offsetleft是只读的，所以要改变div的位置，只能修改style.left

C、offsetleft的值需要事先定义，否则读取到的值为空

D、如果父div的position定义为relative，子div的position定义为absolute，那么子div的style.left的值是相对于父div的值，这与offsetleft是相同的

答案：B

说明：

A、style.left 返回的是字符串，如28px，offsetLeft返回的是数值28，如果需要对取得的值进行计算，还用offsetLeft比较方便。

C、style.left的值需要事先定义，否则取到的值为空。而且必须要定义在html里

D、offsetLeft 获取的是相对于父对象的左边距，left 获取或设置相对于具有定位属性(position定义为relative)的父对象 的左边距

5、关于 this 的工作原理，下面 4 种情况的描述哪一个是错误的？（）

A、在全局范围内，this指向全局对象（浏览器下指window）

B、对象函数调用时，this指向当前对象

C、全局函数调用时，this指向全局函数

D、使用new实例化对象时，this指向新创建的对象

答案：C

说明：C中应该是this指向调用全局函数的对象

6、请给Array本地对象增加一个原型方法，它用于删除数组条目中重复的条目(可能有多个)，返回值是一个包含被删除的重复条目的新数组
d2d6
。

答案：

Array.prototype.delRep=function(){
var result=[this.shift()];
this.sort();
for(var i=0;i<this.length;i++){
if(result[result.length-1]!==this[i]){
result.push(this.splice(i--,1)[0]);
}
}
return this;
}

7、'+new Array(017)' 输出？（ ）
A、17
B、NaN
C、15
D、Error
答案：B
说明：+是一元运算符，可以将字符串转换成number类型；017是八进制数，转换成十进制是15；长度为15的数组，却没有赋值，都是undefined；将长度为15的空数组转换为number类型，为NaN。若长度小于2，结果为0
8、请阅读以下代码：
<div style=”width:400px;height:200px;”>  
<span style=”float:left;width:auto;height:100%;”>           
<i style=”position:absolute;float:left;width:100px;height:50px;”>hello</i>  
</span>
</div>
问题：span标签的width和height分别为多少？
A、width = 0px，height = 0px
B、width = 400px，height = 200px
C、width = 100px，height = 50px
D、width = 0px，height = 200px
答案：D
说明：
1、span标签是行内元素不支持宽高;

2、但float会使span变成行内块状，支持宽高，即高200px，宽由内容撑开；

3、i标签又是绝对定位，脱离了文档流，故span标签的内容为空，所以宽为0；
综上：宽0px，高200px
9、关于跨域问题下面说法正确的是？（）
A、可以利用flash的http请求，来处理跨域问题
B、通过iframe设置document.domain可以实现跨域
C、一般情况下，m.toutiao.com可以ajax请求www.toutiao.com域名下的接口并获得响应
D、通过jsonp方式可以发出post请求其他域名下的接口
答案：B
说明：A是CORS，D是GET不是POST；C主域相同，子域不同，无法ajax跨域
10、在使用 JavaScript 实现省市级联菜单功能时，在添加城市列表前清空原来的下拉选项的代码是()
A、document.myform.selCity.options.clear()
B、document.myform.selCity.options.deleteAll()
C、document.myform.selCity.options.length=0
D、document.myform.selCity.options.size=0
答案：C
11、
(function() {
      var a = b = 5;
  })();   
console.log(b);
console.log(a);
上面的输出结果:
A、5，5
B、undefined，undefined
C、5，undefined
D、5，ReferenceError
答案：D
说明：全局作用域中没有定义a，所以出错；函数中的a随着调用结束会被销毁。而b没有var声明却是全局全局作用域。
12、有如下代码：
var name=’World!’;   
(function() {   
if(typeof name===’undefined’) {   
var name=’Jack’;   
console.log(‘Goodbye’+name);  
} else {   
console.log(‘Hello’+name);  
}  
})();  
请问执行后弹出的值是：（）
A、Hello World!
B、Goodbye Jack
C、Hello Jack
D、Goodbye World!
答案：B
说明：注意函数中的var name;变量声明时会发生变量的提升，即：
(function(){        
var name;//注意这里，变量提升    
if(typeof name === 'undefined'){        
name = 'Jack';        
console.log('Goodbye'+name);    
}else{        
console.log('hello'+name);    
}
})();
typeof name为undefined，故结果Goodbye Jack
13、假设有如下代码，那么a(10)的返回结果是？（ ）
function a(a)
{
  a^=(1<<4)-1;
   return a;
}
A、5
B、10
C、15
D、16
答案：A
说明：1<<4是16，再减1得15；a异或15，得到5；
14、假设 output 是一个函数，输出一行文本。下面的语句输出结果是什么？
output(typeof (function() {output(“Hello World!”)})());
A、undefined Hello World!
B、Object
C、string
D、function
E、Hello World! undefined
答案：E
说明：调用函数输出Hello World!，但函数没有返回值，默认返回undefined；但是，这个typeof干了啥呢？？
15、[不定项选择题]下列程序数据结果是多少（A的 ascii码是65）？ 
#include <stdio.h>  
enum etest{       
eparam1,       
eparam2,       
eparam3=10,       
eparam4,       
eparam5=’a’,     
 
eparam6  
}epr;  
int main() {      
printf(“%d,%d”,eparam4,eparam6);  
return 0;  
}
A、3,98
B、11,34
C、11,98
D、3,34
答案：C
说明：枚举赋值问题，从上一个定义开始逐个递增
16、常见的浏览器端的存储技术有：__ ,__,__.
答案：cookie,sessionStorage,localStorage
说明：
cookies:
只适合小容量的数据存储，它会在同源的http请求中来回传递，因此会一定程度上影响网站的性能，原生的API不友好
localStorage:
可以实现永久存储，通过事件监听可以实现多个标签页的通信
sessionStorage:
针对一个 会话（session） 进行数据存储。当用户关闭该标签页或者浏览器后，数据通常会被删除。
cookie、localStorage、sessionStorage的区别：
三者的区别主要在于数据的生存期和存储容量。
关于数据生存期，cookie数据的生存期取决于开发人员或者用户的设置，localStorage可以实现永久存储，sessionStorage仅在窗口关闭之前有效。
关于数据储存容量，cookie大概是4k，localStorage和sessionStorage可以达到5M以上（浏览器间略有差异）。
同时，它们也有其它的一些差异。比如，跨标签页通信只能使用localStorage，而要跟服务器交流则要通过cookie，localStorage和sessionStorage的API比起cookie好用多了......
17、



以上 javascript 代码执行后， 浏览器 alert 出来的结果分别是

A、undefined,red

B、green,blue

C、undefined,blue

D、green,undefined

E、blued,undefined

答案：B

说明：调用getColor()，在全局作用域中，则this指向window，故弹出green；调用test4399.getColor()，this指向调用它的对象test4399，则弹出blue
this取决于调用函数的对象，而不是定义时的对象。

18、



a的输出结果是？

答案：1,5,2,1,5

19、var a = [1,4,5,2,9];

下面求a中最大值正确的是

A、Math.max(a)

B、Array.max(a)

C、Math.max.call(null,a)

D、Math.max.apply(null,a)

E、以上均不是

答案：D

说明：C中call参数必须是参数列表，不能是a数组，es6的扩展运算符也可以用：Math.max(...a)也正确。