Why do we use IIFE?
A good technique to secure the scope is to use an IIFE. You can utilize IIFEs to avoid difficulties with global variables and alias variables, safeguard private data, and avoid conflicts caused by multiple libraries exporting the same object name.
While some IIFE usages can be replaced with ES6 capabilities, you should still learn about IIFE to fully understand how scope works in JavaScript. Plus, you won't be able to convert legacy projects to ES6 right once. As a result, IIFEs continue to play an important role.
How it is different from normal Function?
We can divide IIFE into two parts Immediately Invoked & Function Expressions so. Immediately Invoked describes that its is does not need to be invoked; it gets executed at the time of deceleration. When we look at the syntax, we can see that there are two pairs of closed parentheses: the first parenthesis contains the logic to be executed, and the second is generally what we include when we call a function; the second parenthesis tells the compiler that the function expression must be executed immediately.
Now the second part, Function Expressions which, is a normal function used as an expression, is wrapped into parentheses.
Eg- (function() { return "Coding Ninjas"; });
Here are some points which make it different from regular expressions.
- The scope of immediately invoked function expressions (IIFEs) is defined. Outside of the function, the variables stated in the function expression are not accessible.
- IIFEs, like other functions, can be anonymous or named.
- IIFEs can be parameterized as well. As an example,
(function (x, y, z) {
console.log(a);
console.log(b);
console.log(c);
})(10, 20, 30);
Output
10
20
30
Conversion of Functions into IIFEs
As we discussed above that IIFEs contain two parentheses and in the first parenthesis, we have to warp our main function and in the second we have to write any parameter passing to that function.
Let's see this conversion through an example.
// Regular Function.
function test()
{
console.log("Coding Ninjas");
};
// Regular Function execution.
test();
// IIFE creation and execution.
(function() { console.log("coding Ninjas"); })();
Output
coding Ninjas //through regular expression
coding Ninjas //through IIFE function
Try it on an online JS compiler.
FAQs
What does IIFE stand for in JavaScript?
A JavaScript function called an IIFE (Immediately Invoked Function Expression) starts as soon as it is defined.
Is IIFE Singleton?
An IIFE is used to implement the Singleton object. Wrapping the function in brackets, followed by two more brackets, causes it to run instantly.
Can an IIFE return a value?
IIFEs can not only return values, but they can also take arguments while being invoked.
Are IIFEs hoisted?
IIFEs are not hoisted, Because they are not the statements.
Where do we use IIFE in JavaScript?
We use IIFE to secure the scope of a variable. You can utilize IIFEs to avoid difficulties with global variables, and alias variables, safeguard private data and avoid conflicts caused by multiple libraries exporting the same object name.
Conclusion
In this article, we have extensively discussed IIFE Immediately Invoked Function Expression) in Javascript.
We hope that this blog has helped you enhance your knowledge regarding IIFE Immediately Invoked Function Expression) in Javascript and if you would like to learn more, check out our articles on Basic of javascript and Functions in JavaScript
Refer to our guided paths on Coding Ninjas Studio to learn more about DSA, Competitive Programming, JavaScript, System Design, etc.
Enroll in our courses and refer to the mock test and problems available.
Take a look at the interview experiences and interview bundle for placement preparations.
Do upvote our blog to help other ninjas grow.
Happy Coding!
Do upvote our blog to help other ninjas grow. Happy Coding!”