Код
function foo{
console.log$x$;
var x = 5;
}
foo;
выведет
undefined

Почему — шаг за шагом $hoistingиобластьвидимости$:

При разборе функции объявления переменных var "поднимаются" $hoisted$ к началу функции. Важно: поднимается только объявление, не присваивание.Фактически движок видит функцию как будто вы написали:
function foo{
var x; // объявление поднято вверх
console.log$x$; // x существует, но ещё не инициализирован — значение undefined
x = 5; // присваивание остаётся на месте
}Поэтому при вызове foo console.log$x$ видит локальную переменную x со значением undefined, а не внешнюю переменную или ошибку.

Тонкие семантические ошибки и опасности

Ожидание ReferenceError: начинающие часто думают, что обращение до объявления должно бросить ошибку. С var это не так — возвращается undefined, что может маскировать ошибку логики.Shadowing $затенение$: локальный var x скрывает внешнюю x. Если вы надеялись читать внешнюю переменную — получите undefined.Неправильное использование function expressions: если вы используете var f = function{}, то объявление f поднимется, но присваивание — нет. Вызов f до присваивания приведёт к TypeError $f—undefined$.Accidental globals: если забыть var/let/const и написать x = 5, в не‑строгом режиме создаётся глобальная переменная $опасно$.Параметры функции и var: redeclare var с именем параметра не даёт эффекта — можно запутаться.Отличие от let/const: let/const имеют TDZ $temporaldeadzone$ — обращение до объявления выбросит ReferenceError, что иногда полезнее для обнаружения ошибок.

Как избежать проблем $рекомендации$

Используйте let и const вместо var — они блок‑ scoped и позволяют поймать обращения до объявления $ReferenceError$.Инициализируйте переменные при объявлении, когда возможно.Объявляйте переменные в начале блока/функции или — ещё лучше — по месту использования, чтобы код был читаем.Включайте "use strict"; — это предотвратит появление неявных глобальных переменных.Используйте линтер $ESLint$ с правилами, запрещающими var и запрещающими использование переменных до объявления.Предпочитайте function declarations для обычных функций $ониполностьюhoisted$, а для выражений осознавайте, что это поведение отличается.

Короткие примеры для сравнения

С var $вашпример$ => undefinedС let:
function foo{ console.log$x$; let x = 5; } // ReferenceError: Cannot access 'x' before initializationFunction declaration hoisted полностью:
foo; function foo{ console.log${}^{\prime }o{k}^{\prime }$; } // OK, вывод 'ok'Function expression:
f; var f = function{console.log${}^{\prime }h{i}^{\prime }$}; // TypeError: f is not a function $f==undefined$

Итого: в вашем примере var x объявлен $hoisted$ до console.log, поэтому вывод — undefined. Чтобы избежать подобных неожиданностей, переходите на let/const, инициализируйте при объявлении и применяйте линтер/strict mode.