22 lines
1.4 KiB
Plaintext
22 lines
1.4 KiB
Plaintext
---
|
|
title: "Explain why the following doesn't work as an IIFE: `function foo(){ }();`. What needs to be changed to properly make it an IIFE?"
|
|
---
|
|
|
|
IIFE stands for Immediately Invoked Function Expressions. The JavaScript parser reads `function foo(){ }();` as `function foo(){ }` and `();`, where the former is a _function declaration_ and the latter (a pair of parentheses) is an attempt at calling a function but there is no name specified, hence it throws `Uncaught SyntaxError: Unexpected token )`.
|
|
|
|
Here are two ways to fix it that involves adding more parentheses: `(function foo(){ })()` and `(function foo(){ }())`. Statements that begin with `function` are considered to be _function declarations_; by wrapping this function within `()`, it becomes a _function expression_ which can then be executed with the subsequent `()`. These functions are not exposed in the global scope and you can even omit its name if you do not need to reference itself within the body.
|
|
|
|
You might also use `void` operator: `void function foo(){ }();`. Unfortunately, there is one issue with such approach. The evaluation of given expression is always `undefined`, so if your IIFE function returns anything, you can't use it. An example:
|
|
|
|
```js
|
|
const foo = void (function bar() {
|
|
return 'foo';
|
|
})();
|
|
|
|
console.log(foo); // undefined
|
|
```
|
|
|
|
## References
|
|
|
|
- [Front End Interview Handbook](https://www.frontendinterviewhandbook.com/javascript-questions)
|