JavaScript Functions & Its Hoisting Rules

JavaScript Functions and Hoisting Functions are one of the most important concepts in JavaScript. A function is a reusable block of code that performs a specific task. JavaScript provides different ways to create functions, such as: Function Declaration Function Expression Arrow Function IIFE These functions can behave differently when hoisting is involved. What is Hoisting in JavaScript? Hoisting is the behavior where JavaScript processes declarations before executing the code. For example: console . log ( name ); var name = " Abishek " ; Output: undefined This happens because the var declaration is processed before execution. We can think of it like this: var name ; console . log ( name ); name = " Abishek " ; Notice that only the declaration is processed early. The value "Abishek" is assigned later. Hoisting does not physically move the code to the top. The same concept also applies to functions, but the behavior depends on how the function is created. What is a Function? A function is a reusable block of code that performs a specific task . Example: function greet () { console . log ( " Hello " ); } greet (); Output: Hello Here: function greet() → function declaration greet() → function call We can call the function whenever we need it. 1. Function Declaration A function declaration is the normal way of creating a function. greet (); function greet () { console . log ( " Hello " ); } Output: Hello Why does this work? Because function declarations are fully hoisted . JavaScript makes the function available before executing the code. Hoisting Rule Function declarations can normally be called before their declaration. Example: greet (); function greet () { console . log ( " Hello " ); } ✅ Works. 2. Function Expression A function expression is a function stored inside a variable. const greet = function () { console . log ( " Hello " ); }; greet (); Here: const greet is a variable, and the variable stores a function. Now look at this: greet (); const greet = function