Как this влияет на свойства и функции объекта

Условие

Определите, какие данные будут выведены в консоль при обращении к разным полям и методам объекта, использующим this.

const obj = {
  a: 1,
  b: this.a + 1,
  c: () => this.a + 1,
  d() {
    return this.a + 1;
  },
  e() {
    return (() => this.a + 1)();
  }
};

console.log(obj.b);
console.log(obj.c());
console.log(obj.d());
console.log(obj.e());

Ответ

В обычном браузерном script без глобального a вывод: NaN, NaN, 2, 2. В ES-модуле код упадёт уже при создании b: верхнеуровневый this равен undefined.

Объектный литерал не создаёт собственный контекст this. Значение b вычисляется сразу во внешнем контексте; стрелка c захватывает тот же внешний this. Метод d вызывается через obj.d(), поэтому получает объект как this. В e внутренняя стрелка наследует this метода и также возвращает 2. Если внешнее окружение имеет собственный a, первые два результата будут зависеть от него, поэтому без указания окружения единственного вывода нет.