Что такое контекст (`this`) и что выведет каждый из трёх `console.log` в приведённом примере?

Зависит от контекста вызова console.log и строгого режима JavaScript ("use strict").

Короткий ответ

Что ответить на собеседовании

Зависит от контекста вызова console.log и строгого режима JavaScript ("use strict").

Подробный разбор

Ответ с пояснениями

Зависит от контекста вызова console.log и строгого режима JavaScript ("use strict").

В глобальном контексте (за пределами функций и модулей):

  • В нестрогом режиме ("use strict" отсутствует или объявлен в функции): this будет ссылаться на глобальный объект (window в браузере, global в Node.js).
  • В строгом режиме: this будет undefined.

Внутри функции:

  • В нестрогом режиме: this будет ссылаться на глобальный объект, если функция вызвана как обычная функция (myFunction()). Если функция вызвана как метод объекта (myObject.myMethod()), this будет ссылаться на объект (myObject). Если функция используется как конструктор (new MyClass()), this будет ссылаться на новый экземпляр объекта.
  • В строгом режиме: this будет undefined, если функция вызвана как обычная функция. В остальных случаях (метод объекта, конструктор) поведение такое же, как в нестрогом режиме.

Внутри стрелочной функции (=>):

  • this лексически наследуется из окружающего контекста. Это означает, что значение this внутри стрелочной функции будет таким же, как и во внешней обычной функции или в глобальном контексте, где была объявлена стрелочная функция, независимо от того, как она вызвана. Стрелочные функции не связывают this со своим собственным контекстом вызова.

Пример:

// Глобальный контекст
console.log(this); // В браузере: Window, в Node.js: global (нестрогий режим)
                    // В браузере: undefined, в Node.js: undefined (строгий режим)

// Обычная функция
function showThisNonStrict() {
  console.log(this);
}

showThisNonStrict(); // В браузере: Window, в Node.js: global

function showThisStrict() {
  "use strict";
  console.log(this);
}

showThisStrict(); // undefined

const myObject = {
  methodNonStrict: function() {
    console.log(this);
  },
  methodStrict: function() {
    "use strict";
    console.log(this);
  }
};

myObject.methodNonStrict(); // myObject
myObject.methodStrict();   // myObject

// Стрелочная функция
const arrowFunc = () => {
  console.log(this);
};

arrowFunc(); // В браузере: Window, в Node.js: global (наследует из глобального контекста)

const myObjectWithArrow = {
  arrowMethod: () => {
    console.log(this);
  }
};

myObjectWithArrow.arrowMethod(); // В браузере: Window, в Node.js: global (наследует из глобального контекста объявления)

Практика в реальном времени

Подготовьтесь к следующему собеседованию

Interview Boost учитывает вакансию, резюме и технологии и помогает сформулировать ответ прямо во время интервью.

Начать подготовку