What is an IIFE in JavaScript? | JavaScript Interview Questions

What You'll Learn

What IIFE is
Why it's used
Modern alternatives

What is IIFE?

An Immediately Invoked Function Expression is a function that runs immediately after being defined.

code.jsJavaScript

// Basic IIFE
(function() {
  console.log('Runs immediately!');
})();

// With arrow function
(() => {
  console.log('Arrow IIFE');
})();

// Named IIFE
(function init() {
  console.log('Initializing...');
})();

Why Use IIFE?

code.jsJavaScript

// 1. Avoid polluting global scope
(function() {
  const privateVar = 'secret';
  // privateVar is not accessible outside
})();

// 2. Create private scope
const counter = (function() {
  let count = 0;
  return {
    increment: () => ++count,
    decrement: () => --count,
    getCount: () => count
  };
})();

counter.increment(); // 1
counter.getCount();  // 1

// 3. Module pattern (before ES6)
const myModule = (function() {
  const private = 'hidden';

  return {
    public: 'visible',
    getPrivate: () => private
  };
})();

Modern Alternatives

code.jsJavaScript

// ES6 block scope
{
  const privateVar = 'secret';
}

// ES6 modules
// module.js
const privateVar = 'secret';
export const publicVar = 'visible';