> Что такое temporal dead zone (TDZ) в JavaScript (JavaScript)

Короткий ответ

Temporal dead zone (TDZ) - это область от начала блока до момента объявления переменной с помощью let или const, где переменная существует, но недоступна для чтения или записи. Попытка обратиться к ней в этой зоне вызывает ReferenceError. TDZ защищает от использования переменных до их инициализации, в отличие от var, где переменная доступна как undefined из-за hoisting.

Подробное объяснение

TDZ - это механизм в JavaScript, который применяется к переменным, объявленным с let и const. Когда интерпретатор входит в блок (например, функция, цикл, условный оператор), он "поднимает" объявление переменной в начало блока (hoisting), но не инициализирует её. Переменная находится в TDZ до тех пор, пока выполнение не достигнет строки с её объявлением.

В TDZ переменная существует в памяти, но к ней нельзя обратиться. Любая попытка чтения, записи или передачи в выражение приводит к ReferenceError. Это отличает let/const от var, где переменная инициализируется значением undefined сразу при hoisting.

TDZ также распространяется на параметры функций с значениями по умолчанию и на классы (class declarations). Например, если внутри класса есть super(), то this находится в TDZ до вызова super().

На практике

TDZ влияет на порядок объявления переменных и на то, как вы структурируете код. Чтобы избежать ошибок:

• Всегда объявляйте let и const в начале блока или функции.
• Не используйте переменную до её объявления, даже в условных конструкциях.
• Будьте осторожны с циклами: в for (let i = 0; ...) каждая итерация создаёт новую переменную с собственной TDZ.
• При работе с классами вызывайте super() до обращения к this.

TDZ также проявляется в typeof: для переменной в TDZ typeof выбрасывает ошибку, а не возвращает "undefined", как для необъявленной переменной.

Пример кода

JAVASCRIPT
// TDZ для let
console.log(a); // ReferenceError: Cannot access 'a' before initialization
let a = 5;

// TDZ для const
const b = 10;
{
  console.log(b); // ReferenceError: Cannot access 'b' before initialization
  const b = 20;
}

// TDZ в параметрах по умолчанию
function test(x = y, y = 1) {
  return x;
}
test(); // ReferenceError: Cannot access 'y' before initialization

// TDZ в классах
class MyClass {
  constructor() {
    console.log(this); // ReferenceError, если не вызван super()
  }
}
class Child extends MyClass {
  constructor() {
    super(); // без super() - TDZ для this
  }
}

Как отвечать на собеседовании

Начните с определения TDZ как временной зоны между началом блока и объявлением переменной. Укажите, что она применима только к let и const. Приведите простой пример с ReferenceError. Объясните, почему TDZ полезна: предотвращает использование переменных до их инициализации. Упомяните отличие от var и hoisting. Если спросят про typeof, скажите, что в TDZ typeof выбрасывает ошибку. Не углубляйтесь в детали реализации движка, если не спрашивают.

Что проверяет интервьюер

• Понимание разницы между var, let и const.
• Знание механизма hoisting и TDZ.
• Умение предсказывать поведение кода с TDZ.
• Осведомлённость о TDZ в классах и параметрах по умолчанию.
• Способность объяснить, зачем TDZ нужна в языке.

Типичные ошибки

• Путать TDZ с hoisting: hoisting есть у всех объявлений, но TDZ блокирует доступ до инициализации.
• Думать, что TDZ применима к var - это не так.
• Считать, что в TDZ переменная равна undefined - на самом деле она недоступна.
• Забывать, что TDZ действует и в блоках, и в функциях, и в циклах.
• Ошибочно полагать, что typeof для переменной в TDZ возвращает "undefined" - это вызывает ошибку.