Функциональная область видимости

Функциональная область видимости означает, что переменная, объявленная с помощью var внутри функции, доступна только внутри этой функции и во всех вложенных блоках — но не за пределами функции.

Пример:

function checkUser() {
  var isLoggedIn = true;
  if (isLoggedIn) {
    var message = "Пользователь авторизован";
    console.log(message); // работает — внутри if
  }
  console.log(message); // тоже работает — message доступна в функции
}

checkUser();
console.log(isLoggedIn); // ошибка: isLoggedIn is not defined
console.log(message);    // ошибка: message is not defined

Здесь isLoggedIn и message видны только внутри функции checkUser. За её пределами — недоступны. Это защищает внешний код от случайных перезаписей.

Но есть важная особенность var: он не имеет блочной области видимости.

Даже если переменная объявлена внутри if, for или while — она всё равно будет доступна во всей функции.

Пример:

function processSettings() {
  if (true) {
    var theme = "dark";
  }
  console.log(theme); // "dark" — доступна, хотя объявлена внутри if
}

processSettings();

То же самое с циклом:

function loopExample() {
  for (var i = 0; i < 3; i++) {
    console.log(i);
  }
  console.log(i); // 3 — i доступна даже после цикла
}

loopExample();

Это поведение — особенность var. Он поднимается (hoisting) и привязывается к функции, а не к блоку {}.

Почему это проблема:

Сложно отслеживать, где именно переменная была объявлена
Можно случайно использовать переменную до её ожидаемого объявления
Ведёт к ошибкам при рефакторинге

Поэтому в современном JavaScript var не рекомендуется. Вместо него используйте let и const — они дают блочную область видимости и предсказуемое поведение.