Почему можно использовать this внутри функции apply?

Разбор использования this внутри функции apply

this внутри Function.prototype.apply() работает совершенно особым образом, потому что apply — это встроенный метод, предназначенный для явного задания контекста выполнения функции.

Ключевой механизм: явное связывание контекста

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

function introduce() {
    console.log(`Меня зовут ${this.name}, мне ${this.age} лет.`);
}

const person1 = { name: 'Анна', age: 30 };
const person2 = { name: 'Иван', age: 25 };

// 'this' внутри introduce будет ссылаться на person1
introduce.apply(person1); // Вывод: Меня зовут Анна, мне 30 лет.

// 'this' внутри introduce теперь ссылается на person2
introduce.apply(person2); // Вывод: Меня зовут Иван, мне 25 лет.

Детальный принцип работы

1. Сигнатура метода: func.apply(thisArg, argsArray)

    *   `thisArg` — значение, которое будет передано функции как `this`.
    *   `argsArray` (опционально) — массив или массивоподобный объект, аргументы из которого будут переданы функции.

1. Алгоритм вызова (упрощенно):

    *   В момент вызова `func.apply(obj, args)` механизм выполнения JavaScript временно связывает функцию `func` с объектом `obj`.
    *   Внутри тела `func` ключевое слово `this` начинает ссылаться на этот переданный объект `obj`.
    *   После завершения выполнения функции эта временная связь разрушается.

Практические аспекты и важные нюансы

• Передача null или undefined: В строгом режиме ('use strict') эти значения передаются в функцию как есть. В нестрогом режиме null и undefined будут заменены на глобальный объект (в браузере - window).

  'use strict';
  function showThis() {
      console.log(this);
  }
  
  showThis.apply(null); // Вывод: null
  showThis.apply(undefined); // Вывод: undefined
  
  // Без 'use strict' в браузере:
  // showThis.apply(null); // Вывод: Window { ... }
  

• Применение с конструкторами: apply можно использовать для вызова конструктора с массивом аргументов, имитируя new с переменным числом параметров. Здесь this создается оператором new, но apply позволяет передать аргументы.

  function Car(brand, model) {
      this.brand = brand;
      this.model = model;
  }
  
  const args = ['Tesla', 'Model 3'];
  const myCar = new (Car.bind(null, ...args))(); // Способ с bind и spread
  // Или более старый паттерн (может не работать с современными нативными конструкторами):
  // const myCar = Object.create(Car.prototype);
  // Car.apply(myCar, args);
  

• Отличие от call: Метод call выполняет ту же функцию явного связывания контекста, но принимает аргументы для функции через запятую, а не в виде массива.

  // apply - аргументы в массиве
  func.apply(context, [arg1, arg2]);
  
  // call - аргументы списком
  func.call(context, arg1, arg2);
  

Резюме

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