前端面试题和答案
1.执行以下代码后
var num = 1;
var obj = {
num: 8,
fun: (function () {console.log(this)
this.num *= 2;
return function () {
this.num *= 2;
}
})()
}
var ooo=obj.fun;
obj.fun();
obj.fun();
最后num和this.num的值？
答案：2和64
2. 最后文字的显示颜色？
<html>
<head>
<title></title>
<style>
#color a {
color:red;
}
.color a {
color:yellow
}
h1 a {
color:blue
}
a {
color:orange
}
</style>
</head>
<body>
<div id="color">
<p class="color">
<h1><a>文字颜色</a></h1>
</p>
</div>
</body>
</html>
答案：红色
3.输出到控制台结果
function fun1() { console.log("aa") };
function fun2(){
return fun1;
function fun1(){
console.log("bb")
}
}
fun2()();
答案："bb"
4. 有两个无序数组，infoPart和infoTotal，实现将infoTotal里的 name信息赋值到infoPart里面
1 var infoPart = new Array( 2 { id: 223 }, 3 { id: 444 }, 4 { id: 220 }, 5 { id: 399 }, 6 { id: 320 } 7 ); 8 var infoTotal = new Array( 9 { id: 220, name: "ff", age: 31 }, 10 { id: 444, name: "rr", age: 30 }, 11 { id: 333, name: "kk", age: 25 }, 12 { id: 320, name: "tt", age: 34 }, 13 { id: 223, name: "yy", age: 32 } 14 );
注意上面两行红字
实现方式1
1 //实现方式1 2 for (var i = 0; i<infoPart.length; i++) { 3 if( infoTotal.find(function(a){return a.id==infoPart[i].id})) 4 infoPart[i].name= infoTotal.find(function(a){return a.id==infoPart[i].id}).name; 5 }
实现方式2
1 //实现方式2 2 infoPart.sort((a, b) =>{ 3 return a.id > b.id; 4 }) 5 infoTotal.sort((a, b) => { 6 return a.id > b.id; 7 }) 8 var flag=true; 9 var i=j=0; 10 while(flag){ 11 if(infoPart[i]){ 12 if(infoPart[i].id==infoTotal[j].id){ 13 infoPart[i].name=infoTotal[j].name; 14 i++; 15 j++ 16 }else if(infoPart[i].id<infoTotal[j].id) 17 i++; 18 else 19 j++; 20 }else{ 21 break; 22 } 23 }
实现方式3，就是双层遍历，这里不再具体写代码了
5.实现一个距离未来某一天倒计时的时钟
1 function timeBack(){ 2 var endDay=new Date("2020/9/11 0:0:0"); 3 var today=new Date(); 4 var end=endDay.getTime(); 5 var now=today.getTime(); 6 var ms=end-now; 7 var days=Math.floor(ms/(1000*60*60*24)); 8 var hours=Math.floor(ms%(1000*60*60*24)/(1000*60*60)); 9 var minutes=Math.floor(ms%(1000*60*60)/(1000*60)); 10 var seconds=Math.floor(ms%(1000*60)/1000); 11 document.getElementById("p1").innerHTML="距离2020/9/11："+days+"天"+hours+"时"+minutes+"分"+seconds+"秒"; 12 setTimeout(timeBack, 1000); 13 };
null和undefined的区别?
区别：
下面的这些结果分别是多少？
void(0)=?
Boolean('')=? Boolean(' ')=? Boolean('false')=? Boolean(false)=?
Number('100px')=? parseInt('100px')=?
答案：
void(0)=undefined
Boolean('')=false Boolean(' ')=true Boolean('false')=true Boolean(false)=false
Number('100px')=NaN parseInt('100px')=100
实现一个闭包和继承的例子 (http://blog.csdn.net/canot/article/details/50760470)
例子如下：
1 function extend(obj1){ 2 function F(){ } 3 //判断传递进行的是一个new出来的对象 4 if(typeof obj1 == "object"){ 5 for(var i in obj1){ 6 //直接调用对象的属性来获取，调用方法的prototype来接受 7 F.prototype[i] = obj1[i]; 8 } 9 } 10 //返回函数 11 return F; 12 } 13 var person_son = extend(new Person()); 14 var p = new person_son(); 15 p.sayHello(); 16 p.setName("abc"); 17 alert(p.getName());
手机里的事件有哪些？
基本事件：
touchstart //手指刚接触屏幕时触发
touchmove //手指在屏幕上移动时触发
touchend //手指从屏幕上移开时触发
下面这个比较少用：touchcancel //触摸过程被系统取消时触发
每个事件都有以下列表，比如touchend的targetTouches当然是 0 咯：
touches //位于屏幕上的所有手指的列表
targetTouches //位于该元素上的所有手指的列表
changedTouches //涉及当前事件的所有手指的列表
在字符串中查找子字符串，列出所有匹配项的索引值
自己写的笨方法：
1 var str1="abcdfhjreabkdjgdabcfdg"; 2 var str2="abc"; 3 var indexArr=[]; 4 for(var i=0;i<str1.length;i++){ 5 if(str1[i]==str2[0]) 6 indexArr.push(i); 7 } 8 var returnArr=indexArr; 9 for(var j=0;j<indexArr.length;j++){ 10 for(var i=1;i<str2.length;i++){ 11 if(str1[indexArr[j]+i]!==str2[i]){ 12 returnArr.splice(j,1); 13 break; 14 } 15 } 16 }
使用indexOf最好：
深拷贝与浅拷贝？
关闭窗口会触发什么事件？
onclose,onunload,onbeforeunload
dom树的理解？
requestAnimationFrame和setTimeout，setInterval的区别？
如果使用setInterval函数每100ms执行一段代码，中间有一次任务执行时间为1000ms，那么这次任务后会连续执行10次代码吗（即setInterval的任务会堆积吗）
参见：http://www.cnblogs.com/hyea/p/5596079.html
nodejs跨域
http://www.cnblogs.com/zhoudaozhang/p/4704396.html
