JavaScript Hoisting Explained: Memory Allocation, Not Code Movement

JavaScript hoisting is commonly misunderstood as the engine physically moving declarations to the top of a file, but this is technically inaccurate. Before any code runs, the JavaScript engine performs a memory creation phase where it scans all declarations and allocates memory for variables and functions. During this phase, var variables are initialized to undefined, while full function declarations are stored in memory with their complete definitions. This distinction explains why calling a function declaration before its written position works, whereas invoking a function stored in a var variable throws a TypeError, since the variable holds undefined at that point. Understanding these two engine phases — memory creation and execution — makes hoisting a straightforward concept rather than a confusing quirk.