Как меняется значение this при отрыве метода от объекта

Условие

Определите, что будет выведено в консоль после вызова функции fn().

const obj = {
  a: 1,
  show(num) {
    if (num !== undefined) {
      console.log(this.a + num);
      return;
    }
    console.log(this.a);
  },
};

const fn = obj.show;
fn();

Ответ

Метод потерял привязку к obj. В строгом режиме fn() получит this === undefined и выбросит TypeError; в нестрогом глобальное this обычно даст undefined при отсутствии a.

Присваивание const fn = obj.show сохраняет функцию, но не объект-получатель. Значение a: 1 само по себе не привязывает метод. В ES-модуле действует строгий режим. Для гарантированного результата 1 используйте один из вариантов:

const bound = obj.show.bind(obj);
bound(); // 1
obj.show.call(obj); // 1
const wrapped = () => obj.show();
wrapped(); // 1

Стрелка-обёртка сохраняет вызов через объект; превращение самого метода в стрелку не решает задачу динамического this.