美文网首页
前端笔试题汇总(一)

前端笔试题汇总(一)

作者: lifeColder | 来源:发表于2017-05-22 22:14 被阅读0次

    题目一 : 统计字符串中出现次数最多的字符

    eg : var s = "abcdefghijklabcdaaaefadca" ; // 其中a出现次数最多,7次

    拿到这个题目,会怎么做呢?

    首先我想到两种思路:

    • 暴力查找,一个一个元素拿出来,再循环,得到次数放入json键值对中,再比较大小
    • 找到一个删除一个,利用正则表达式替换,长度之差便是其重复的次数

    暴力查找:

    var s = "abcdefghijklabcdaaaefadca";
    var json = {};
    var Max = {
        key:"",
        value:0
    };
    var arr = s.split("");
    for(var i=0;i<arr.length;i++){
        json[s[i]] = 0;
        for(var j=0;j<arr.length;j++){
            if(s[i] == arr[j]){
                json[s[i]]++;
            }
        }
    }
    for(prop in json){
        if(json[prop] > Max.value){
            Max.key = prop;
            Max.value = json[prop]
        }
    }
    console.log(Max); //得出正确结果
    

    正则法:

    var s = "abcdefghijklabcdaaaefadca";
    //用于存放各字母出现的次数
    var json = {};
    //用于存放出现次数为最大值的字母
    var Max = {
        key:"",
        value:0
    };
    //正则替换,长度之差就是出现的次数
    while(s){
        var len1 , len2;
        len1 = s.length;
        var first = s.charAt(0);
        s = s.replace(new RegExp(first,"g"),'');
        len2 = s.length;
        json[first] = len1-len2;
    }
    //找最大值
    for(prop in json){
        if(json[prop] > Max.value){
            Max.key = prop;
            Max.value = json[prop]
        }
    }
    console.log(Max); //得出答案
    

    这个题目还有一个好方法:

    var s = "abcdefghijklabcdaaaefadca";
    var json = {};
    var Max = {
        key:"",
        value:0
    };
    for(var i=0;i<s.length;i++){
        if(!json[str.charAt(i)]){
            json[str.charAt(i)] = 1;   //不存在就自动创建,
        }else{
            json[str.charAt(i)]++;     //如果已经存在就加1.
        }
    }
    console.log(json);
    //找最大值
    for(prop in json){
        if(json[prop] > Max.value){
            Max.key = prop;
            Max.value = json[prop]
        }
    }
    console.log(Max); //得出答案
    
    这种算法时间复杂度为O(n),可以说是很简单了!
    

    题目二 : 求下面的输出值

    function Show(){
        getName = function(){
            console.log(1);
        }
        return this;
    }; 
    Show.getName = function(){
        console.log(2);
    };
    Show.prototype.getName = function(){
        console.log(3);
    };
    var getName = function(){
        console.log("4");
    }
    function getName(){
        console.log(5);
    };
    
    求这些问题的解:
    1、Show.getName();    
    2、getName();        
    3、Show().getName();   
    4、getName();          
    5、new Show.getName();  
    6、new Show().getName();  
    7、new new Show().getName();
    

    这道题目考察的是Javascript基础,

    首先要明白JS执行过程:

    1. 先提升(先提升函数,再提升变量,如果名字一样,变量提升会覆盖函数提升)
    2. 再执行,如果遇到闭包创建
    3. 在闭包空间中反复1和2
    4. 先定义(提升),在执行
    5. 变量提升
    6. 函数提升

    本题目解答如下:

    1. 形如 func.method(函数名.属性),函数也是对象,发现Show.getName()有定义,就执行方法属性,输出2
    2. 根据JS执行过程,先提升函数getName(),再提升变量getName , 同名覆盖,就知道变量getName覆盖了其同名函数,执行变量getName,结果是 “4”
    3. 形如 func().method() ,意思是先执行 func() , 由 func() 的返回值执行method方法,所以先要知道 func() 返回值是什么? return this; this指什么呢? 谁调用指向谁,func是全局调用 , 所以this指向window ,Show()函数执行后,里面把getName的定义该变了,所以,window.getName() 输出是 1
    4. getName() , 在当前环境等同于 window.getName() ,输出是 1
    5. new Show.getName() 先执行show.getName()输出2 在new一下
    6. new Show().getName() 使用了new关键字,是把函数show当成了构造器,此时return没有作用,getName在构造器里没有,找原型对象 输出 3
    7. new new Show().getName() 就是在第六问基础之上输出 3 之后,在new一个

    javascript所有的函数都可以使用 new func()关键字,表示生成一个对象。这点理解了,理解上面的就简单

    Javascript 简单概念

    1、 javascript的typeof返回哪些数据类型

    • object , number , function , boolean , undefind , string

    2、 检测数组的几种方法 , 检测obj是否是数组类型

    • Array.isArray(obj);
    • obj instanceof Array
    • arr.constructor.name
    • toString.call()

    3、传统事件绑定和符合W3C标准的事件绑定有什么区别?

    传统事件绑定:

    <div onclick=””>123</div>
    <script>
       div1.onclick=function(){};
    </script>
    <button  onmouseover=””></button>
    
    • 如果说给同一个元素绑定了两次或者多次相同类型的事件,那么后面的绑定会覆盖前面的绑定
    • 不支持DOM事件流 事件捕获阶段è目标元素阶段=>事件冒泡阶段

    符合W3C标准的事件绑定的方式 addEventListener/attachEvent
    A、非IE浏览器:addEventListener

    • 如果说给同一个元素绑定了两次或者多次相同类型的事件,所以的绑定将会依次触发
    • 支持DOM事件流的
    • 进行事件绑定传参不需要on前缀
    • addEventListener(“click”,function(){},true);//此时的事件就是在事件捕获阶段执行
    • 第三个参数:代表是否在捕获阶段执行,默认值是false
    • ddEventListener(“click”,function(e){})
    • addEventListener(“click”,function(){},false) 事件在冒泡阶段执行

    B、IE浏览器

    • ie9开始,ie11 edge:addEventListener
    • ie9以前 ie8:attachEvent/detachEvent
    • 进行事件类型传参需要带上on前缀
    • dom1.attachEvent(“onclick”,functioin(){});
      这种方式只支持事件冒泡,不支持事件捕获

    4、call和apply的区别

    call和apply相同点:
    都是为了用一个本不属于一个对象的方法,让这个对象去执行

    • toString.call([],1,2,3)
    • toString.apply([],[1,2,3])
    • Object.call(this,obj1,obj2,obj3)
    • Object.apply(this,arguments)

    区别:

    • call第二个参数开始接受一个参数列表
    • apply第二个参数开始接受一个参数数组

    5、jQuery框架中$.ajax()的常用参数有哪些?

    • type

      1. 类型:String
      2. 默认值: "GET")。请求方式 ("POST" 或 "GET"), 默认为 "GET"。注意:其它 HTTP 请求方法,如 PUT 和 DELETE 也可以使用,但仅部分浏览器支持。
    • url

    1. 类型:String
    2. 默认值: 当前页地址。发送请求的地址。
    • success
    1. 类型:Function 请求成功后的回调函数。
    2. 参数:由服务器返回,并根据 dataType 参数进行处理后的数据;描述状态的字符串。
      这是一个 Ajax 事件。
    • options
    1. 类型:Object
    2. 可选。AJAX 请求设置。所有选项都是可选的。
    • async
    1. 类型:Boolean
    2. 默认值: true。默认设置下,所有请求均为异步请求。如果需要发送同步请求,请将此选项设置为 false。
      注意,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行。
    • beforeSend(XHR)
    1. 类型:Function
    2. 发送请求前可修改 XMLHttpRequest 对象的函数,如添加自定义 HTTP 头。
      XMLHttpRequest 对象是唯一的参数。
    3. 这是一个 Ajax 事件。如果返回 false 可以取消本次 ajax 请求
    • cache
    1. 类型:Boolean
    2. 默认值: true,dataType 为 script 和 jsonp 时默认为 false。设置为 false 将不缓存此页面。

    相关文章

      网友评论

          本文标题:前端笔试题汇总(一)

          本文链接:https://www.haomeiwen.com/subject/jgiixxtx.html