"Hoisting" Pronounce,Meaning And Examples

"Hoisting" Meaning

Hoisting is a language mechanism in JavaScript where variables, functions, and classes are moved to the top of their scope before the code is executed, regardless of where they are declared. This means that variables, functions, and classes declared with the `let`, `const`, and `class` keywords are hoisted to the top of their enclosing scope, whereas functions declared with the `function` keyword are hoisted, but their bodies are not. This concept is important to understand in JavaScript programming.

"Hoisting" Examples

Hoisting

Hoisting is a concept in JavaScript that refers to the process of moving declarations to the top of their scope. Here are 5 usage examples:

Example 1: Var Declaration

console.log(x); // logs undefined
var x 10;

hoisting occurs, and the `var x` declaration is moved to the top:


var x;
console.log(x); // logs undefined
x 10;

Example 2: Function Declaration

console.log(add(2, 3)); // logs 5
function add(a, b) {
return a + b;
}

hoisting occurs, and the `function add` declaration is moved to the top:


function add(a, b) {
return a + b;
}
console.log(add(2, 3)); // logs 5

Example 3: Let/Const Declaration

console.log(y); // logs undefined
let y 20;

an error occurs, as let/const declarations are not hoisted:


ReferenceError: y is not defined
console.log(y); // logs undefined
let y 20;

Example 4: Variable with Initial Value

console.log(z); // logs 30
var z 30;

hoisting occurs, and the `var z 30` declaration is moved to the top:


var z 30;
console.log(z); // logs 30

Example 5: Math Function with Hoisting

console.log(Math.max(1, 2, 3)); // logs 3

hoisting occurs, and the `Math.max` function is moved to the top:


window.Math window.Math || {};
Math.max function(a, b, c) {
return Math.max.apply(null, arguments);
};
console.log(Math.max(1, 2, 3)); // logs 3