Understanding JavaScript Hoisting: Why console.log(test) Returns Undefined

JavaScript may appear to run code line by line from top to bottom, but in reality it first compiles declarations within the current scope and then executes statements sequentially.

During the compilation phase, function and var declarations are hoisted. The variable name is created, but its assignment is not performed until the execution phase reaches the assignment statement.

Example 1 demonstrates this behavior:

console.log(test); // undefined because only the declaration is hoisted
var test = "你好";   // assignment happens here
console.log(test); // "你好"
console.log(test2); // ReferenceError: test2 is not defined

When the first console.log(test) runs, the variable test has been declared (so no error) but not yet assigned, resulting in undefined. The identifier test2 was never declared, so accessing it throws a ReferenceError.

The compilation steps can be visualized as:

// Hoist var declaration
var test;

// Execution phase
console.log(test); // undefined
test = "你好";
console.log(test); // "你好"
console.log(test2); // ReferenceError

Function declarations follow a similar but slightly different rule: the entire function body is hoisted and assigned to the function name.

test(); // prints "你好"
function test() {
  console.log("你好");
}

Internally this is equivalent to:

// Hoist function as a variable holding the function object
var test = function () {
  console.log("你好");
};

// Execution phase
test();

A more complex example shows how inner function declarations create local bindings that shadow outer variables:

var a = 1;
function test() {
  a = 2; // refers to the outer variable unless a local one is created
  function a() {} // creates a local function named a, hoisted before the assignment
}

test();
console.log(a); // still 1 because the inner <code>a</code> is a separate local binding

During compilation, the inner function a is hoisted, turning a into a local variable inside test. Consequently, the assignment a = 2 modifies the local a, leaving the outer a unchanged.