Understanding JavaScript Hoisting Clearly

Introduction

Hoisting is a JavaScript behavior that often confuses beginners.

In this guide, we’ll explain what hoisting is and how it really works behind the scenes.

What Is Hoisting?

Hoisting is JavaScript’s behavior of moving declarations to the top of their scope.

Function Hoisting

sayHello();

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

Function declarations are fully hoisted.

Variable Hoisting

console.log(x);
var x = 10;

Variables declared with var are hoisted but initialized as undefined.

let and const

let and const are hoisted but remain in the temporal dead zone.

Final Thoughts

Understanding hoisting helps avoid unexpected bugs in JavaScript code.