• 前端面试题和答案


    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

  • 相关阅读:
    内存、时间复杂度、CPU/GPU以及运行时间
    内存、时间复杂度、CPU/GPU以及运行时间
    四叉树问题
    四叉树问题
    基于深度学习的人脸识别系统(Caffe+OpenCV+Dlib)【三】VGG网络进行特征提取
    爬楼梯问题种种
    爬楼梯问题种种
    Python 在线笔试
    基于深度学习的人脸识别系统(Caffe+OpenCV+Dlib)【二】人脸预处理
    标准模板库 STL 使用之 —— vector 使用 tricks
  • 原文地址:https://www.cnblogs.com/fangsmile/p/6401800.html
Copyright © 2020-2023  润新知