JavaScript Hoisting

Written by Swapnil RajaPublished 24 Aug 2026

JavaScript hoisting moves declarations to the top of their scope before the code runs.

Only the declaration moves. The value stays exactly where you wrote it.

This is why a var can be used before its line without an error, but is undefined.

Example

javascript

console.log(count);

var count = 5;

console.log(count);

The first line prints undefined rather than causing an error.

The second prints 5.

What is Hoisting?

Before running your code, JavaScript scans each scope and registers every declaration it finds.

It is as if the declarations were lifted to the top, which is where the name comes from.

PreviousJavaScript Block Scope NextJavaScript Temporal Dead Zone

Complete Example

html

<!DOCTYPE html>
<html>
<head>
  <title>JavaScript Hoisting</title>
</head>
<body>

  <h1>JavaScript Hoisting</h1>

  <p id="result"></p>

  <script>
    let output = "";

    output += "Before: " + typeof count + "<br>";

    var count = 5;

    output += "After: " + count;

    document.getElementById("result").innerHTML = output;
  </script>

</body>
</html>

JavaScript Hoisting

Example

What is Hoisting?

Syntax

Function Declarations are Fully Hoisted

Example

Function Expressions are Not

Example

let and const Behave Differently

Example

Hoisting is Per Scope

Example

How to Avoid Hoisting Confusion

Example

Complete Example

Try It Yourself

Important Points

Conclusion