Можно ли применить метод из объекта через изменение this на текущий объект?

Можно ли изменить this при вызове метода объекта?

Да, это возможно, и даже является фундаментальной возможностью JavaScript. Ключевой момент заключается в том, что значение this в JavaScript динамически определяется не местом объявления функции, а способом её вызова (за исключением стрелочных функций). Для управления значением this существуют три специальных метода: call(), apply() и bind().

Основные методы управления this

Эти методы доступны для любой функции, так как они являются свойствами встроенного прототипа Function.prototype.

1. call(context, ...args)

Немедленно вызывает функцию, явно устанавливая this в первый переданный аргумент (context). Последующие аргументы передаются в функцию как обычные параметры.

const user = { name: 'Анна' };
const car = { brand: 'Toyota' };

function showInfo(model, year) {
  console.log(`Пользователь: ${this.name}, Машина: ${this.brand}, Модель: ${model}, Год: ${year}`);
}

// Вызываем функцию showInfo, но this внутри неё будет указывать на объект car
showInfo.call(car, 'Camry', 2022);
// Вывод: Пользователь: undefined, Машина: Toyota, Модель: Camry, Год: 2022

// А здесь this будет указывать на объект user
showInfo.call(user, 'Focus', 2020);
// Вывод: Пользователь: Анна, Машина: undefined, Модель: Focus, Год: 2020

2. apply(context, argsArray)

Работает идентично call(), но аргументы для вызова функции передаются в виде массива (или array-like объекта).

const product = { title: 'Ноутбук' };

function calculatePrice(tax, discount) {
  const basePrice = 1000;
  const finalPrice = basePrice * (1 + tax) * (1 - discount);
  console.log(`Товар: ${this.title}, Итоговая цена: ${finalPrice.toFixed(2)}`);
}

const args = [0.2, 0.1]; // tax = 20%, discount = 10%
calculatePrice.apply(product, args);
// Вывод: Товар: Ноутбук, Итоговая цена: 1080.00

3. bind(context, ...args)

В отличие от call и apply, не вызывает функцию сразу. Вместо этого возвращает новую функцию, в которой this навсегда привязан к переданному значению (context). Это называется каррированием или частичным применением.

const server = { env: 'production' };

function logMessage(level, message) {
  console.log(`[${this.env}] ${level.toUpperCase()}: ${message}`);
}

// Создаём новую функцию, где this жёстко привязан к объекту server
const boundLog = logMessage.bind(server);

// Теперь можно вызывать boundLog где угодно, this всегда будет = server
boundLog('error', 'Connection lost');
// Вывод: [production] ERROR: Connection lost

// Можно также частично применить аргументы
const logInfo = logMessage.bind(server, 'info');
logInfo('Server started on port 3000');
// Вывод: [production] INFO: Server started on port 3000

Практическое применение в контексте объектов

Представьте, что у вас есть метод одного объекта, который вы хотите повторно использовать для другого объекта с аналогичной структурой.

const calculator1 = {
  value: 5,
  double() {
    return this.value * 2;
  }
};

const calculator2 = {
  value: 10
};

// Заимствуем метод double из calculator1, применяя его к calculator2
const result = calculator1.double.call(calculator2);
console.log(result); // 20

Важные ограничения и нюансы

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

  const obj = { x: 1 };
  const arrowFunc = () => console.log(this.x);
  arrowFunc.call(obj); // Выведет undefined (или значение window.x), но не 1!
  

• Жёсткая привязка с помощью bind() создаёт новую функцию-обёртку. Оригинальная функция не изменяется.

• В строгом режиме ('use strict'), если в call() или apply() передать null или undefined в качестве контекста, this внутри функции будет равно undefined. В нестрогом режиме this в таком случае будет ссылаться на глобальный объект (например, window в браузере), что может быть источником ошибок.

Вывод: Управление значением this — это мощный механизм JavaScript, который лежит в основе таких паттернов, как заимствование методов, каррирование, декораторы функций и реализация наследования через конструкторы. Понимание работы call, apply и bind критически важно для профессиональной разработки на JavaScript.