Что такое Hoisting

Question

Что такое Hoisting

Тип вопроса: JavaScript Вероятность: 24% Категория: Frontend Разработчик

Ответ

Hoisting — это механизм в JavaScript, при котором объявления переменных и функций "поднимаются" вверх своей области видимости перед выполнением кода.

Переменные:

var — hoisting с инициализацией undefined
let/const — hoisting без инициализации (временная мертвая зона)

Функции:

Function Declaration — поднимается целиком
Function Expression — поднимается как переменная

Пример:

console.log(x); // undefined (hoisting var)
var x = 5;

sayHi(); // "Hello" (Function Declaration hoisted)
function sayHi() { console.log("Hello"); }

// console.log(y); // ReferenceError (TDZ для let)
let y = 10;

Ответ 18+ 🔞

О, смотри-ка, про этот ваш "хоистинг"! Ну, механизм, конечно, пиздец какой хитрый, как мартышка на банане. В общем, представь: JavaScript, такой хитрожопый, перед тем как код выполнять, начинает всё объявленное — переменные, функции — вверх своей области видимости подтягивать. Как будто на лифте, блядь. Но не всё так просто, ёпта!

С переменными, например, полный разброд:

var — ну, эта старая потаскуха. Её поднимают, но сразу инициализируют как undefined. То есть место застолбили, а значение — хуй там. "Вот твоя квартира, живи пока в коробке".
let и const — эти уже посерьёзнее. Их тоже поднимают, охуенно же? Но инициализации-то нет! И получается "временная мёртвая зона" — попробуй к ним до объявления обратись, получишь ReferenceError прямо в ебальник. Сиди и жди своего часа, пидрила.

С функциями вообще отдельный цирк:

Function Declaration — вот это царь. Её поднимают целиком, со всем телом, с потрохами. Можно вызывать хоть сверху, хоть снизу — она уже тут как тут, готовая.
Function Expression — а это уже похуист. Поднимается только объявление переменной, в которую её потом запихнут. Сама функция — нет. Так что если попытаешься вызвать раньше присваивания — получишь или undefined, или ошибку, если переменная через let.

Вот, смотри, наглядная хуйня:

console.log(x); // undefined (потому что var подняли, но не проинициализировали нормально)
var x = 5;

sayHi(); // "Hello" (Function Declaration — поднялась вся, как на дрожжах)
function sayHi() { console.log("Hello"); }

// console.log(y); // ReferenceError (вот она, временная мёртвая зона для let! Не лезь, убьёт!)
let y = 10;

Вот и весь сказ, блядь. Сначала мозг сломаешь, пока поймёшь, кто куда всплыл и когда доступен, а потом привыкнешь и будешь этим как палочкой-выручалочкой пользоваться. Главное — не наступать на грабли let/const до их объявления, а то охуеешь от ошибок.