SpiderJS

Hoisting in JavaScript moves variable and function declarations to the top of their scope before execution, but the behavior varies between old (ES5) and modern (ES6+) JavaScript. In ES5, var variables are hoisted with undefined, and function declarations are fully hoisted, making them callable anywhere. In ES6+, let and const are hoisted but enter a Temporal Dead Zone (TDZ), causing errors if accessed before declaration. Arrow functions are not hoisted and must be declared before use. The Temporal Dead Zone (TDZ) is the period where let and const variables are inaccessible until declared. Example: All Forms of Hoisting console.log(myVar); // undefined console.log(myLet); // Error: Cannot access 'myLet' before initialization console.log(myFunc()); // "I am a function!" console.log(myArrow); // TypeError: myArrow is not a function var myVar = "I am var!"; let myLet = "I am let!"; function myFunc() { return "I am a function!"; } const myArrow = () => "I am an arrow function!"; Explanation: myVar (with var) is hoisted with undefined. myLet (with let) is in TDZ, causing a ReferenceError. myFunc (function declaration) is fully hoisted and works. myArrow (arrow function) is not hoisted, throwing a TypeError. Resources MDN Web Docs: Hoisting MDN Web Docs: let MDN Web Docs: const W3Schools: JavaScript Hoisting JavaScript Info: Hoisting

May 1, 2025 - 16:30

Hoisting in JavaScript moves variable and function declarations to the top of their scope before execution, but the behavior varies between old (ES5) and modern (ES6+) JavaScript. In ES5, var variables are hoisted with undefined, and function declarations are fully hoisted, making them callable anywhere. In ES6+, let and const are hoisted but enter a Temporal Dead Zone (TDZ), causing errors if accessed before declaration. Arrow functions are not hoisted and must be declared before use.

The Temporal Dead Zone (TDZ) is the period where let and const variables are inaccessible until declared.

Example: All Forms of Hoisting

console.log(myVar); // undefined
console.log(myLet); // Error: Cannot access 'myLet' before initialization
console.log(myFunc()); // "I am a function!"
console.log(myArrow); // TypeError: myArrow is not a function

var myVar = "I am var!";
let myLet = "I am let!";
function myFunc() {
  return "I am a function!";
}
const myArrow = () => "I am an arrow function!";

Explanation:
- myVar (with var) is hoisted with undefined.
- myLet (with let) is in TDZ, causing a ReferenceError.
- myFunc (function declaration) is fully hoisted and works.
- myArrow (arrow function) is not hoisted, throwing a TypeError.