20道精选的面试题附答案，进来看看能答对多少（一）

你的名字 2022-10-16 07:24 194阅读 0赞

![467960d533f9475ddba71561cbf8f2de.png][]

来源 | https://www.cnblogs.com/echoyya/p/14518968.html

以下面试目，本人验证无误，查阅了相关资料，得出解析部分并做了相关总结，希望对正准备跳槽或找工作的你有所帮助！

#### **1、写出执行结果** ####

function side(arr) {
      arr[0] = arr[2];
    }
    function a(a, b, c) {
      c = 10;
      side(arguments);
      return a + b + c;
    }
    a(1, 1, 1);

**答案及解析**

答案 : 21
    解析 : 
        1. 调用 a 函数，abc 都是 1，
        2. 后 c 赋值为10，
        3. 调 side 函数，参数 arguments对象，是形参abc的引用，此时 abc 为[1，1，10] 
        4. 给 arr[0] 赋值，即 a = c = 10,
        5. 输出结果 10 + 1 + 10 = 21

#### **2、题一稍加改动，写出执行结果** ####

function side(arr) {
      arr[0] = arr[2];
    }
    function a(a, b, c = 3) {
      c = 10;
      side(arguments);
      return a + b + c;
    }
    a(1, 1, 1);

**答案及解析**

答案 : 12
    解析 : arguments 中的 c 还是 1，不会变成10，因为 a 函数给了默认值，就按ES6的方式解析，ES6有块级作用域，所以 c 的值是不会改变的。

#### **3、 写出执行结果**    ####

var min = Math.min();
    var max = Math.max();
    console.log(min < max);  //会是什么？

**答案及解析**

答案 : false
    解析 : 按常规思路，应该输出 true，最小值小于最大值，但是却是false，MDN是这样解释的：- Math.min(): 如果没有参数，结果为 Infinity (无穷大)
        - Math.max(): 如果没有参数，结果为 - Infinity (无穷小)    console.log(-0.0000000000001 > Math.max())    // true

#### **4、写出执行结果，并解释原因** ####

var a = 1;
    (function a(){
        a = 2
        console.log(a)
    })()

**答案及解析**

答案 : ƒ a(){
            a = 2
            console.log(a)
          }
    解析 : IIFE: Immediately Invoked Function Expression 立即执行函数，存在的目的就是为了隔离作用域，防止污染全局命名空间。因此 IIFE 有自己独立的作用域，如果函数名称与内部变量名冲突，就会永远执行函数本身，所以输出函数本身
    了解 : 
        1. 立即执行函数可以是匿名函数 ;(function(){ var ....})()
        2. 开始的第一个字符使用分号，避免出现代码压缩时产生意外的错误return reslut;(function(){...})(), 在省略分号之后，变成return 一个函数了
        3. 函数执行一对()的位置: ;(function(){....}())  效果同 ;(function(){....})() 常见为第二种

#### **5、 写出执行结果，并解释原因** ####

**答案及解析**

答案 : c   a 
    解析 : 在于运行时的this指向，取决于被谁调用，
        1. 第一问：getFullname 是作为obj.prop对象的方法被调用，此时执行环境就是该对象，即返回 c
        2. 第二问：getFullname 被分配给test变量，此时执行环境是全局对象，window，即返回 a

#### **6、写出执行结果，并解释原因** ####

var company = {
        address: 'beijing'
    }
    var obj = Object.create(company);
    delete obj.address
    console.log(obj.address);

**答案及解析**

答案 : c   a 
    解析 : MDN解释，Object.create()方法创建一个新对象，使用现有的对象来提供新创建的对象的__proto__。
    Object.create(proto), 其中proto是 新创建对象的原型对象。
        - obj 通过prototype继承了company 的address属性，自己并没有该属性，所以delete操作符是没有作用的
        - delete使用原则: 是用来删除一个对象的属性，但仅限于在自身的属性上起作用(不可操作原型上的属性)，若删除的属性不存在，那么delete将不会起作用，但仍会返回true

#### **7、写出执行结果，并解释原因** ####

var foo = function bar(){ return 12; };
    console.log(typeof bar());

**答案及解析**

答案 : 报错 ReferenceError: bar is not defined
    解析 : 命名函数表达式 函数只能在函数体内有效
        var foo = function bar(){ 
            // foo 可用
            // bar 可用
            console.log(typeof bar); // function
        };
        // foo 可用
        // bar 不可用

#### **8、 写出执行结果，并解释原因** ####

var x=1;
    if(function f(){}){
        x += typeof f;
    }
    console.log(x)

**答案及解析**

答案 : 1undefined
    解析 : 两点
        1. 函数声明在运算符中其值为true,但是放在运算符中的函数声明在执行阶段是找不到的
        2. 未声明的变量执行 typeof 不会报错，而是返回 undefined

#### **9、写出执行结果，并解释原因** ####

function f(){
        return f;
    }
     console.log(new f() instanceof f);

**答案及解析**

答案 : false
    解析 : 
        - a instanceof b 用于检测 a 是否是 b 的实例，检测的是原型，检测过程中会遍历 a 的原型链，直到找到 b 的 prototype，如果存在返回true 否则返回false
        - 本题中return f后，new f()其返回的结果是 f 的函数对象，并不是一个实例，因此返回false
        - 改动一下即可返回true
      function f(){}
       console.log(new f() instanceof f); // true

#### **10、写出执行结果，并解释原因** ####

var foo = {
        bar: function(){
            return this.baz;
        },
        baz:1
    }
    console.log(typeof (f=foo.bar)());

**答案及解析**

答案 : undefined
    解析 : 将foo.bar 赋值给 f ，相当于f(),此时 this 指向 window

#### **11、写出执行结果，并解释原因** ####

for (let i = 0; i < 3; i++) {
      setTimeout(() => console.log(i), 1);
    }

**答案及解析**

答案 : 0  1  2
    解析 : 使用let声明变量具有块级作用域（块是{}之间的任何内容）每次循环 i 将被创建为一个新值，并且每个值都会存在于循环内的块级作用域
    for (var i = 0; i < 3; i++) {
      setTimeout(() => console.log(i), 1);
    }
    // 3 3 3 
    由于JS的中的事件执行机制，setTimeout函数真正被执行时，循环已经结束，由于是使用var声明的变量 i ，
    因此该值是全局的，在循环期间自增，执行setTimeout函数时，i = 3

#### **12、写出执行结果，并解释原因** ####

const num = {
      a: 10,
      add() {
        return this.a + 2;
      },
      reduce: () => this.a -2;
    };
    console.log(num.add());
    console.log(num.reduce());

**答案及解析**

答案 : 12  NaN
    解析 : add 是普通函数，reduce是箭头函数，对于箭头函数this指向是它所在的上下文环境(定义时的位置)，
    意味着调用reduce时，this指向的并不是num对象 而是window，且全局并没有 a 属性，返回undefined，undefined - 2 返回NaN

#### **13、 写出执行结果，并解释原因** ####

const person = { name: "Echoyya" };
    
    
    function sayHi(age) {
      return `${this.name} is ${age}`;
    }
    console.log(sayHi.call(person, 5));
    console.log(sayHi.bind(person, 5));

**答案及解析**

答案 : Echoyya is 5 ; 
            ƒ sayHi(age) {
              return `${this.name} is ${age}`;
            }
    解析 : call, bind方法都可以改变this指向，但是 call方式会立即执行，bind方法返回一个绑定函数，带有执行上下文，但不会立即执行，需要在调用一下。

#### **14、 写出执行结果，并解释原因** ####

["1", "2", "3"].map(parseInt);

**答案及解析**

答案 : [1, NaN, NaN]
    解析 : // 以上代码等同于
    ["1", "2", "3"].map((item, index) => parseInt(item, index));
    parseInt(string, radix) 解析一个字符串并返回指定基数的十进制整数
    radix是2-36之间的整数，表示被解析字符串的基数。
        - 该参数省略或其值为 0，则数字将以 10 为基础来解析；
        - 如果以 “0x” 或 “0X” 开头，将以 16 为基数；
        - 如果小于 2 或者大于 36，将返回 NaN。
    分步执行：parseInt('1',0)，parseInt('2',1)，parseInt('3',2)，由于'3'不属于二进制字符，返回NaN

#### **15、写出执行结果，并解释原因** ####

[typeof null, null instanceof Object]

**答案及解析**

答案 : ['object', false]
    解析 : 
        1. typeof返回一个表示类型的字符串，typeof null 返回'object'
        2. instanceof 用于检测constructor.prototype是否存在于参数object的原型链上

#### **16、写出执行结果，并解释原因** ####

var arr = [0,1];
    arr[5] = 5;
    newArr = arr.filter(function(x) { return x === undefined;});
    console.log(newArr.length);  // ?

**答案及解析**

答案 : 0
    解析 : filter方法，为数组中每个元素调用一次callback，返回一个由满足条件的元素组成的新数组，callback只会在已经赋值的索引上被调用，
    对于被删除或未被赋值的索引不会被调用， arr[5]=5之后，arr的值为 [0, 1, empty × 3, 5]，
    索引为234的元素没有初始化，并不存在于数组中，在callback函数调用时会跳过，因此没有一个元素的值是undefined。

#### **17、写出执行结果，并解释原因** ####

function showCase(value) {
        switch(value) {
        case 'A':
            console.log('Case A');
            break;
        case 'B':
            console.log('Case B');
            break;
        case undefined:
            console.log('undefined');
            break;
        default:
            console.log('Do not know!');
        }
    }
    showCase(new String('A'));

**答案及解析**

答案 : Do not know!
    解析 : switch 是严格比较，String实例和字符串不一样
        var str1 = 'str';
        var str2 = new String('str')
        console.log(typeof str1) // 'string'
        console.log(typeof str2) // 'object'

#### **18、写出执行结果，并解释原因** ####

console.log([2,1,0].reduce(Math.pow));  // ?
    console.log([].reduce(Math.pow));       // ?
    
    
    A. 2 报错
    B. 2 NaN
    C. 1 报错
    D. 1 NaN

**答案及解析**

答案 : C
    解析 : reduce(callback, initialValue) 方法参数callback是一个回调函数，并作为累加器，数组中的每个值从左到右开始计算，最终返回一个值。参数initialValue是累加器初始值
    该回调函数可接收四个参数：total  必需。初始值, 或者计算结束后的返回值。currentValue 必需。当前元素。currentIndex  可选。当前元素索引。arr 可选。当前元素所属的数组对象。
    而Math.pow 可接收两个参数，即前两个参数
    分步执行得到：Math.pow(2,1) => 2 ，Math.pow(2,0) => 1，要有一些数学基础哦,所以第一个console输出 1 ，而第二个console将报错TypeError: Reduce of empty array with no initial value，
    原因是：if the array is empty and no initialValue was provided,TypeError would be thrown ,意思是说，若数组为空且没有提供initialValue初始值，将会抛出TypeError

#### **19、写出执行结果，并解释原因** ####

**答案及解析**

答案 : 4  2  1 
    解析 : 
        1. Foo.a()：调用 Foo 的静态方法 a，虽然 Foo 中有优先级更高的属性方法 a，但 Foo 此时没有被调用，所以此时输出 Foo 的静态方法 a 的结果：4
        2. let obj = new Foo(); 使用 new 方法调用函数，返回函数实例对象，此时 Foo 函数内部的属性方法初始化，原型方法建立。
        3. obj.a(); 调用 实例方法 a，该实例目前有两个 a 方法：一个内部属性方法，一个原型方法。当两者重名时，内部属性方法优先级更高，会覆盖后者，所以输出2
        4. Foo.a(); 根据第2步可知 Foo 函数内部的属性方法已初始化，覆盖了同名的静态方法，所以输出：1

#### **20、写出执行结果，并解释原因** ####

const value  = 'Value is' + !!Number(['0']) ? 'Echoyya' : 'undefined';
    console.log(value);

**答案及解析**

答案 : Echoyya
    解析 : 
        1.  !!Number(['0']) 返回false
        2. + 运算符优先级 大于 ? 运算符，
        所以该题目等价于 'Value is false' ? 'Echoyya' : 'undefined',而不是 'Value is (false' ? 'Echoyya' : 'undefined')

本文完~

#  #

**学习更多技能**

**请点击下方公众号**

![43c1d86bb0cb7242ca85db8ce09eca59.gif][]

[467960d533f9475ddba71561cbf8f2de.png]: /images/20221014/3be4dda50abe4cfd8f6f2005a95a8eb5.png
[43c1d86bb0cb7242ca85db8ce09eca59.gif]: /images/20221014/24fb3617d49741b29a2d7f84452d2d50.png