美文网首页
前端面试题

前端面试题

作者: PharkiLL | 来源:发表于2020-04-25 10:59 被阅读0次

    1. Undefined 和 null 的区别?

    undefined 的字面意思就是:未定义的值 。这个值的语义是,希望表示一个变量最原始的状态,而非人为操作的结果

    1.1 声明一个变量,但是没有赋值

    var foo;
    console.log(foo); // undefined
    访问 foo,返回了 undefined,表示这个变量自从声明了以后,就从来没有使用过,也没有定义过任何有效的值。

    1.2 访问对象上不存在的属性或者未定义的变量
    1.3 函数定义了形参,但没有传递实参
    1.4 使用void对表达式求值

    null 的字面意思是:空值 。这个值的语义是,希望表示一个对象被人为的重置为空对象,而非一个变量最原始的状态 。在内存里的表示就是,栈中的变量没有指向堆中的内存对象。
    总结:undefined 表示一个变量自然的、最原始的状态值,而 null 则表示一个变量被人为的设置为空对象,而不是原始状态。所以,在实际使用过程中,为了保证变量所代表的语义,不要对一个变量显式的赋值 undefined,当需要释放一个对象时,直接赋值为 null 即可。

    2. 什么是闭包

    ①、闭包就是能够读取其他函数内部变量的函数。
    ②、将函数内部和函数外部连接起来的桥梁。
    可以避免使用全局变量,防止全局变量污染
    闭包找到的是同一地址中父级函数中对应变量最终的值

    3. 变量提升 和块级作用域

    JavaScript的工作原理是先编译再执行,在编译过程中,解释器会把所有声明“移动”到所在作用域的最上面,而赋值或其他逻辑会留在原地,这就是变量提升。

    foo();
    function foo(){
      console.log(a); // undefined
      var a = 2;  
    }
    在编译后将被理解为下面的形式
    
    function foo(){
      var a;
      console.log(a); // undefined
      a = 2;  
    }
    foo();
    

    JS中作用域有:全局作用域、函数作用域。没有块作用域的概念。ECMAScript 6(简称ES6)中新增了块级作用域,使用let声明的变量只能在块级作用域里访问,有“暂时性死区”的特性(也就是说声明前不可用)。
    块作用域由 { } 包括,if语句和for语句里面的{ }也属于块作用域。

    {
           var a = 1;
           console.log(a); // 1
       }
       console.log(a); // 1
       // 可见,通过var定义的变量可以跨块作用域访问到。
    
       (function A() {
           var b = 2;
           console.log(b); // 2
       })();
       // console.log(b); // 报错,
       // 可见,通过var定义的变量不能跨函数作用域访问到
    
       if(true) {
           var c = 3;
       }
       console.log(c); // 3
       for(var i = 0; i < 4; i++) {
           var d = 5;
       };
       console.log(i); // 4   (循环结束i已经是4,所以此处i为4)
       console.log(d); // 5
       // if语句和for语句中用var定义的变量可以在外面访问到,
       // 可见,if语句和for语句属于块作用域,不属于函数作用域。
    

    4.map 和 forEach的区别

    区别:
    1、forEach()返回值是undefined,不可以链式调用。
    2、map()会分配内存空间存储新数组并返回,forEach()不会返回数据。
    forEach()允许callback更改原始数组的元素。map()返回新的数组。

    1. 执行速度 foreach < map

    5. 一口井7米深,一只青蛙白天爬3米,晚上坠2米,问青蛙多少天才能爬出去

    递归写法:
    var day = 0
    function xxx(n){
        day++
        n -= 3 
        if(n<=0) return day
        return xxx(n + 2) 
    }
    
    循环写法:
    var day = 0
    var height = 7
    for(var i = 1; i <100; i++){
        height -= 3
        day = i
        if(height <= 0) {
            console.log(day)
            break
        }
        height +=2
    }
    
    答案是5
    

    v-if 和 v-show的区别

    v-if 是“真正”的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。

    v-if 也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。

    相比之下,v-show 就简单得多——不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 进行切换。

    一般来说,v-if 有更高的切换开销,而 v-show 有更高的初始渲染开销。因此,如果需要非常频繁地切换,则使用 v-show 较好;如果在运行时条件很少改变,则使用 v-if 较好。

    1.共同点

    都是动态显示DOM元素

    2.区别

    (1)手段:

    v-if是动态的向DOM树内添加或者删除DOM元素;

    v-show是通过设置DOM元素的display样式属性控制显隐;

    (2)编译过程:

    v-if切换有一个局部编译/卸载的过程,切换过程中合适地销毁和重建内部的事件监听和子组件;

    v-show只是简单的基于css切换;

    (3)编译条件:

    v-if是惰性的,如果初始条件为假,则什么也不做;只有在条件第一次变为真时才开始局部编译(编译被缓存?编译被缓存后,然后再切换的时候进行局部卸载);

    v-show是在任何条件下(首次条件是否为真)都被编译,然后被缓存,而且DOM元素保留;

    (4)性能消耗:

    v-if有更高的切换消耗;

    v-show有更高的初始渲染消耗;

    (5)使用场景:

    v-if适合运营条件不大可能改变;

    v-show适合频繁切换。

    相关文章

      网友评论

          本文标题:前端面试题

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