Как поменять контекст функции ?
Спросят с вероятностью 10%

Контекст выполнения функции (значение this внутри функции) может быть изменён несколькими способами. Это позволяет более гибко управлять тем, как функции вызываются, особенно в объектно-ориентированном программировании. Вот основные способы изменения контекста функции:

1️⃣ call() и apply()

Позволяют вызывать функцию с явным указанием объекта, который должен быть использован в качестве this, и с передачей аргументов в эту функцию.

✅ call(thisArg, arg1, arg2, ...): Вызывает функцию с указанным контекстом thisArg и аргументами arg1, arg2, ...
✅ apply(thisArg, [argsArray]): Аналогичен call, но принимает аргументы в виде массива.

function greet() {
  console.log(Привет, ${this.name});
}

const person = { name: 'Алексей' };

greet.call(person);  // Привет, Алексей
greet.apply(person); // Привет, Алексей

2️⃣ bind()

(thisArg[, arg1[, arg2[, ...]]]) создаёт новую функцию с привязанным контекстом thisArg и начальными аргументами arg1, arg2, ... function greet() { console.log(Привет, ${this.name}); } const person = { name: 'Мария' }; const greetPerson = greet.bind(person); greetPerson(); // Привет, Мария 3️⃣ Стрелочные функции (() => {}) не имеют собственного контекста this. Вместо этого они заимствуют this из окружающего лексического контекста. Это значит, что this внутри стрелочной функции будет таким же, как и в её родительском контексте, что упрощает работу с контекстом, особенно в колбэках и обработчиках событий.

const person = {   name: 'Иван',   greet: function() {     // Стрелочная функция заимствует thisиз методаgreet     window.setTimeout(() => console.log(Привет, ${this.name}`), 1000);
  }
};

person.greet(); // Привет, Иван (после задержки в 1 секунду)

Использование контекста в классах

ES6 для методов, которые вы хотите передать в качестве колбэков и при этом сохранить контекст класса, часто используется .bind(this) в конструкторе или определение метода через стрелочную функцию в свойстве класса.

Изменение контекста функции — мощный механизм, позволяющий более гибко управлять выполнением кода. call(), apply(), и bind() дают возможность явно указать контекст this для функций, в то время как стрелочные функции позволяют наследовать контекст из родительского лексического окружения, делая код более чистым и понятным.

👉 Можно посмотреть Примеры как отвечают люди на этот вопрос, или перейти к Списку всех вопросов на Frontend Developer. Ставь 👍 если нравится контент.

🔐 База собесов | 🔐 База тестовых