前端笔记

分享前端开发思考与感悟

JavaScript面试编码问题-1

在线编码是软件开发人员工作面试的关键部分。在本文中,我将尝试添加几个编码问题。这些将是针对评估的代码段,而不是基于任务的编码问题。此外,我将在每个问题的结尾共享在线代码链接。

让我们从最著名的之一开始:

  1. 在这个问题中,评估了闭包和异步代码处理知识。
    // What will be the console log of the code below?
    for (var i = 0; i < 4; i++) {
      setTimeout(() => console.log(i), 0);
    }
    

    它将在控制台中写入4、4、4、4,因为setTimeout()它是
    异步功能,将在for循环完成后执行。i在for循环范围之外定义,console.log()开始写入时等于4 。
    您如何解决它写0、1、2、3?以下是可能的解决方案:

    // Solution 1:
    for (let i = 0; i < 4; i++) {
      setTimeout(() => console.log(i), 0);
    }
    
    // Solution 2:
    for (var i = 0; i < 4; i++) {
      (function (i) {
        setTimeout(() => console.log(i), 0);
      })(i);
    }
    

    解决方案1:您可以更改ivar到的声明,let
    因为它let是块范围的变量,但是var是函数范围的变量。
    解决方案2:您可以setTimeout()使用函数包装以限制变量
    的范围i。但是您应该将i参数作为参数传递给IIFE(立即调用的函数表达式)。

    您可以通过此链接对其进行测试。

  2. 这是关于这一范围的。
    // What will be the logs in console?
    function nameLogger() {
      this.name = 'halil';
      console.log('first:', this.name);
    }
    
    console.log('second:', this.name);
    nameLogger();
    console.log('third:', this.name);
    

    控制台输出如下:

    second: undefined
    first: halil
    third: halil
    

    虽然“秒”的执行this.name是不确定的,但是在nameLogger()函数执行后,它将被定义。因为,this是指函数中的全局对象。所以其他人按预期记录了halil。
    !! 它不能使用,'use strict'因为在函数中,在严格模式下,它等于undefined而不是全局对象。

    您可以通过此链接对其进行测试。

  3. 最后一个是关于thisbind
    // What will be written?
    const module = {
      x: 55,
      getX: function () {
        console.log('x:', this.x);
      }
    };
    const unboundX = module.getX;
    unboundX();
    

    控制台输出将是x: undefined因为this引用当前所有者对象。因此,当您仅将getX方法分配给新对象时unboundXthis将引用它。而且它没有x属性,因此this.x等于undefined
    您可以使用bind()以下方法修复它:

    const boundX = unboundX.bind(module);
    boundX();
    

    现在,将模块对象绑定到unboundX函数。这样就可以达到x模块的属性。

    您可以通过此链接对其进行测试。

本系列将继续撰写新文章。希望对您有所帮助。

点赞

发表评论

电子邮件地址不会被公开。 必填项已用*标注