面试题

作者: Wxq_59f9 | 来源:发表于2019-12-09 10:49 被阅读0次

    手写数组去重,多种方法

    1:es6set去重

    function unique (arr) {
      return Array.from(new Set(arr))
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
     //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {}, {}]
    不考虑兼容性,这种去重的方法代码最少。这种方法还无法去掉“{}”空对象,后面的高阶方法会添加去掉重复“{}”的方法。
    

    2:indexof

    
    function unique(arr) {
        if (!Array.isArray(arr)) {
            console.log('type error!')
            return
        }
        var array = [];
        for (var i = 0; i < arr.length; i++) {
            if (array .indexOf(arr[i]) === -1) {
                array .push(arr[i])
            }
        }
        return array;
    }
    var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
    console.log(unique(arr))
    

    filter

    
    function unique(arr) {
      return arr.filter(function(item, index, arr) {
        //当前元素,在原始数组中的第一个索引==当前索引值,否则返回当前元素
        return arr.indexOf(item, 0) === index;
      });
    }
        var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
            console.log(unique(arr))
    //[1, "true", true, 15, false, undefined, null, "NaN", 0, "a", {…}, {…}]
    

    : 思路:定义一个新数组,并存放原数组的第一个元素,然后将元素组一一和新数组的元素对比,若不同则存放在新数组中

      function unique(arr) {
                let newArr = [arr[0]];
                for (let i = 1; i < arr.length; i++) {
                    let repeat = false;
                    for (let j = 0; j < newArr.length; j++) {
                        if (arr[i] === newArr[j]) {
                            repeat = true;
                            break;
                        }else{
                            
                        }
                    }
                    if (!repeat) {
                        newArr.push(arr[i]);
                    }
                }
                return newArr;
            }
     
            console.log(unique([1, 1, 2, 3, 5, 3, 1, 5, 6, 7, 4]));
    

    实现一个clone函数

    可以对JavaScript中的5种主要数据类型(Number、String、Object、Boolean、Function、Array)进行值复制

      function clone(data){
           let obj;
            switch (typeof data){
                    case "undefined":
                          break;
                    case "string":
                          obj = data+'';
                          break;
                    case "number":
                          obj = data-0;
                          break;
                    case "boolean":
                          obj = data;
                          break;
                    case "object":
                          break;
    

    浏览器是如何渲染页面的

    (1)浏览器解析html源码,然后创建一个 DOM树。
    在DOM树中,每一个HTML标签都有一个对应的节点,并且每一个文本也都会有一个对应的文本节点。DOM树的根节点就是 documentElement,对应的是html标签。

    (2)浏览器解析CSS代码,计算出最终的样式数据。构建CSSOM树。
    对CSS代码中非法的语法它会直接忽略掉。解析CSS的时候会按照如下顺序来定义优先级:浏览器默认设置 < 用户设置 < 外链样式 < 内联样式 < html中的style。

    (3)DOM Tree + CSSOM --> 渲染树(rendering tree)
    渲染树和DOM树有点像,但是是有区别的。DOM树完全和html标签一一对应,但是渲染树会忽略掉不需要渲染的元素,比如head、display:none的元素等。而且一大段文本中的每一个行在渲染树中都是独立的一个节点。渲染树中的每一个节点都存储有对应的css属性。

    (4)一旦渲染树创建好了,浏览器就可以根据渲染树直接把页面绘制到屏幕上

    call,apply,bind方法得作用分别是什么

    作用: 改变调用他们的函数体内部this的指向

    1: 传的参数

    call方法传参:xw.say.call(xh);
    apply方法传参:xw.say.apply(xh);
    bind方法传参:xw.say.bind.(xh)();

    相关文章

      网友评论

        本文标题:面试题

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