Демистификация подъема в JavaScript😵
Вы когда-нибудь чувствовали, как JavaScript дрожит, когда что-то идет не так, как ожидалось? Давайте окунемся в восхитительный, но непростой мир подъемных механизмов! 😅
Распространенная головная боль JavaScript 😩
Представьте себе: вы пишете код, и вдруг переменные ведут себя неправильно, функции выходят из строя, и воцаряется хаос. Это загадочная сфера подъема, источник недоумения для многих разработчиков. 😱
Давайте приступим к кодированию бизнеса:
// Declarations
console.log('Before');
// Variables declared with var have 'undefined' before initialization
console.log('a:>', a); // undefined
// Variables declared with let|const give error if used before initialization
// Uncomment to see behavior with not initialized variables
// console.log('b:>', b); // Not Initialized
// console.log('c:>', c); // Not Initialized
//Will work fine because Functions declared with function keyword get Initialized during memory allocation
console.log('d:>', d); //Function d
// Functions declared with let|const give error if used before initialization
// Uncomment to see behavior with not initialized variables
// console.log('e:>', e); // Not Initialized
// console.log('f:>', f); // Not Initialized
// Variables declared with var have 'undefined' before initialization
console.log('g:>', g); // undefined
console.log('h:>', h); // undefined
// Functions declared with let|const give error if used before initialization
// Uncomment to see behavior with not initialized variables
// console.log('i:>', i); // Not Initialized
// console.log('j:>', j); // Not Initialized
//Will work fine because Functions declared with function keyword get Initialized during memory allocation
d();
// Variable Assignments
var a = 'A';
let b = 'B';
const c = 'C';
// Function Declarations
function d() {
console.log('D');
}
let e = () => console.log('E');
const f = () => console.log('F');
var g = () => console.log('G');
var h = function () {
console.log('H');
};
let i = function () {
console.log('I');
};
const j = function () {
console.log('J');
};
// Execution
console.log('After');
console.log('a:>', a);
console.log('b:>', b);
console.log('c:>', c);
console.log('d:>', d);
console.log('e:>', e);
console.log('f:>', f);
console.log('i:>', i);
console.log('j:>', j);
d();
e();
f();
g();
h();
i();
j();
Разрушение магии:
Распределение памяти и выполнение кода 🤖:
- Перед запуском кода JavaScript выделяет память для переменных и функций.
- Во время выполнения он поднимает наверх объявления, но не задания. 🕵️♂️
Что такое подъем? 🚁
Подъем похож на съемочную группу за кулисами спектакля. Он поднимает объявления наверх, делая переменные и функции доступными даже до того, как они будут официально представлены. 😎
Типы переменных выходят на сцену:
- var: Заходит поздно, перед назначением представляется как
'undefined'
. - let|const: Охраняется и не появляется до официального объявления.
- function: Звезда шоу! Привлекает внимание с самого начала.
Заключение:
JavaScript со своими причудами и сюрпризами держит нас в напряжении. Понимание подъема похоже на пропуск за кулисы внутренней работы языка. Итак, возьмите подъемник и кодируйте! 🚀🎉