Skip to content

Latest commit

 

History

History
132 lines (107 loc) · 3.96 KB

hoisting.md

File metadata and controls

132 lines (107 loc) · 3.96 KB

Hoisting

hoisting

  • "In JavaScript, hoisting is behavior where we can use variables and functions before they are declared in our code."

    However, it's important to note that only the declarations are hoisted, not the initializations. If you initialize a variable after using it, the value will be undefined until the assignment statement is executed.

Here are a few examples to illustrate hoisting:

  • Variable Hoisting:

    console.log(myVariable); // undefined
var myVariable = 10;  
console.log(myVariable); // 10

  • Function Hoisting:

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

  • Function Expression Hoisting:

    sayHello(); // TypeError: sayHello is not a function
var sayHello = function() {
console.log("Hello");
};

  • TDZ (Temporal Dead Zone)

tdz

  • The TDZ (Temporal Dead Zone) error occurs when we try to access or use variables declared with let and const before they are formally declared or initialized. In other words, we cannot access these variables before their declaration or initialization in our code, or we will encounter a TDZ error.

Here's an example to illustrate hoisting with let and const:

  • Example 1:

    console.log(myVariable); // ReferenceError: Cannot access 'myVariable' before initialization
const myVariable = 10;

  • Example 2:

    function example() {
if (true) {
  console.log(myVariable); // ReferenceError: Cannot access 'myVariable' before initialization
  let myVariable = 20;
 }
}
example();

  • Example 3:

    function example(param = myVariable) { // ReferenceError: Cannot access 'myVariable' before initialization
let myVariable = 30;
console.log(param);
}
example();

  • Bonus Example:

    {
// bestFood’s TDZ starts here (at the beginning of this block’s local scope)
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
console.log(bestFood); // returns ReferenceError because bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
let bestFood = "Vegetable Fried Rice"; // bestFood’s TDZ ends here
// bestFood’s TDZ does not exist here
// bestFood’s TDZ does not exist here
// bestFood’s TDZ does not exist here
}
    {
// TDZ starts here (at the beginning of this block’s local scope)
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
let bestFood = "Vegetable Fried Rice"; // bestFood’s TDZ ends here
console.log(bestFood); // returns "Vegetable Fried Rice" because bestFood’s TDZ does not exist here
// bestFood’s TDZ does not exist here
// bestFood’s TDZ does not exist here
}
    {
// TDZ starts here (at the beginning of this block’s local scope)
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
// bestFood’s TDZ continues here
let bestFood; // bestFood’s TDZ ends here
console.log(bestFood); // returns undefined because bestFood’s TDZ does not exist here
bestFood = "Vegetable Fried Rice"; // bestFood’s TDZ does not exist here
console.log(bestFood); // returns "Vegetable Fried Rice" because bestFood’s TDZ does not exist here
}

For more: