IIFE are mainly used to encapsulate scope
(function () {
let myVar = 10; // not global
// ...
}());
but why not just use a block statement?
{
let myVar = 10; // also not global
// ...
}
are there other benefits for using IIFE further than scope encapsulation?
IIFE are mainly used to encapsulate scope
(function () {
let myVar = 10; // not global
// ...
}());
but why not just use a block statement?
{
let myVar = 10; // also not global
// ...
}
are there other benefits for using IIFE further than scope encapsulation?
Share Improve this question asked Jul 25, 2018 at 21:24 Lucas NoetzoldLucas Noetzold 1,7401 gold badge18 silver badges31 bronze badges 14-
Variable
myVar
is not global because of the keywordlet
. – Ele Commented Jul 25, 2018 at 21:27 -
Once an IIFE is pleted anything within the closure that isn't returned is discarded, otherwise using a block statement whatever scope that the variables are contained within isn't necessarily removed and
myvar
could possibly be left in a larger scope that it isn't wanted or warranted to be available within. – zfrisch Commented Jul 25, 2018 at 21:28 - Block scope is ES6+ feature, It doesn't work in old browser like IE. Also, only variables declared by const and let are block scoped. For var you need IIFE – m51 Commented Jul 25, 2018 at 21:29
-
A block doesn’t have a return value. IIFEs may be replaced by
do
expressions in the future. – Sebastian Simon Commented Jul 25, 2018 at 21:29 - 1 I realize I may be confusing the issue with too many words. Apologies! The less wordy version is that an IIFE can immediately return something to the scope it was called within without polluting any higher scope or causing a syntax error for declaring the same variable more than once. – zfrisch Commented Jul 25, 2018 at 22:28
3 Answers
Reset to default 6Block statements are a pretty recent feature. And yes, before they were introduced, IIFEs were used instead.
Nowadays I can think of at least one case, when IIFEs are irreplacable. Look at this:
(async () => { const foo = await someAsyncFunction() })()
See? The await
keyword can only live in an async
function, hence if your await
-containing expression is not wrapped by any function, you have to wrap it by an async IIFE.
UPD: this answer is outdated, since top-level await
is now available, so no need to use IIFE to wrap it, so there are even less uses for IIFEs now, if any.
IIFEs take advantage of function scope. Functions and variables declared with var
are scoped within the parent function.
Block statements take advantage of block scope. Variables declared with let
and const
are scoped within the block.
Block statements don't encapsulate functions or variables declared with var
.
Try this you'll understand the concept better:
if(true){
var something = 'something' // This is global now. Block scoping for var works fine inside function definition but not for **if statements** or similar ones
}
console.log(something)
Try changing var to let you won't be able to access something in the console.log statement.