Codectionary / Developer documentation / JavaScript

Hoisting

Hoisting is JavaScript's behavior of moving declarations (not initializations) to the top of their scope before code executes. Function declarations are fully hoisted, including their body, so they can be called before their definition. var declarations are hoisted but initialized as undefined. let and const are hoisted but remain in a "temporal dead zone" - accessing them before their declaration throws an error.

Syntax

// Declarations are processed before code runs

Examples

Function Declaration Hoisting

Function declarations can be called before they appear in the code.

sayHello(); // works! "Hello!"

function sayHello() {
  console.log("Hello!");
}

var vs let/const Hoisting

The key difference in how var and let/const behave when accessed early.

console.log(x); // undefined - var is hoisted with a default value
var x = 5;

try {
  console.log(y); // ReferenceError - in the temporal dead zone
  let y = 10;
} catch (e) {
  console.log(e.message);
}

Function Expressions Are Not Hoisted the Same Way

A common source of confusion between declarations and expressions.

try {
  sayHi(); // TypeError - sayHi is undefined at this point, not a function yet
  var sayHi = function() {
    console.log("Hi!");
  };
} catch (e) {
  console.log(e.message);
}

Best practices

  • Do not rely on hoisting to call functions before their definition, even though it works for declarations - write code in logical, top-to-bottom order for readability
  • Use let and const instead of var to avoid the confusing undefined-hoisting behavior entirely
  • Understand the temporal dead zone as the reason `ReferenceError` sometimes appears for variables that are technically declared later in the same scope
  • Declare all variables at the point where they are actually needed rather than depending on hoisting behavior

Runtime & versions

Browsers and JavaScript runtimes. Feature availability depends on the language and runtime version used by your project; consult the official reference below.

ECMAScript specification

Specifications & further reading