Hoisting of Functions in JavaScript

Posted by

Function Hoisting in JavaScript

Function Hoisting in JavaScript

Function hoisting is a concept in JavaScript that allows you to use a function before it has been declared.

Example of Function Hoisting

Let’s look at an example of function hoisting:

    
        
            myFunction(); // This will work

            function myFunction() {
              console.log("Hello, function hoisting!");
            }
        
    
    

In the above example, the function myFunction is called before it is declared, but it still works because of function hoisting.

How Function Hoisting Works

When JavaScript code is executed, all variable and function declarations are moved to the top of their containing function or script. This is known as hoisting.

For example, when a function is declared using the function keyword, the entire function declaration is hoisted to the top of the scope in which it is defined.

Function Expressions and Hoisting

It’s important to note that function hoisting only applies to function declarations, not function expressions.

For example:

    
        
            myFunction(); // This will throw an error

            var myFunction = function() {
              console.log("Hello, function hoisting!");
            }
        
    
    

In this example, calling myFunction before it is defined will throw an error because function expressions are not hoisted.

Conclusion

Function hoisting is an important concept to understand in JavaScript. It allows you to use functions before they have been declared, which can be useful in certain situations. However, it’s important to note that function hoisting only applies to function declarations, not function expressions.