What is Hoisting?
Hoisting is JavaScript's default behavior of moving all declarations to the top of the current scope (to the top of the current script or the current function).
Variable
Example of hoisting
console.log(A); // Returns undefined, as the only declaration was hoisted, no initialization has happened at this stage
var A = 'edward';
Explain for this one, the declare of A
will push to the top of the current scope. But the value of A
does not assign for now. See the code below.
var A; // Declaration
console.log(A); //Returns undefined, as only declaration was hoisted, no initialization has happened at this stage
A = 'edward'; // Initialization
The let and const Keywords
Variables defined with
let
andconst
are hoisted to the top of the block, but not initialized.Meaning: The block of code is aware of the variable, but it cannot be used until it has been declared.
Using a let or const variable before it is declared will result in a
ReferenceError
.
console.log(A); // Uncaught ReferenceError: Cannot access 'A' before initialization
let A = 'edward';
//const similar to let.
Function
One of the advantages of JavaScript putting function declarations into memory before it executes any code segment is that it allows you to use a function before you declare it in your code. For example:
displayName('Edward'); // My name is Edward
function displayName(name) {
console.log(`My name is ${name}`);
}
let displayName1 = displayName('Edward');
let displayName2 = new displayName('Edward');
console.log(displayName1) //underfined
console.log(displayName2) // {}
Even though we call the function in our code first, before the function is written, the code still works. This is because of how context execution works in JavaScript.
Reference :
https://www.w3schools.com/js/js_hoisting.asp
https://developer.mozilla.org/en-US/docs/Glossary/Hoisting
Latest comments (0)