Что такое самовызывающаяся функция (IIFE) в JavaScript
Что проверяют
Знаете ли вы, откуда взялся этот приём и зачем он был нужен до модулей и let/const. Следом обычно спрашивают, где IIFE встречается сейчас и чем её заменили.
Как отвечать
IIFE (Immediately Invoked Function Expression) это функциональное выражение, которое вызывается сразу после объявления: (function () { ... })() или стрелкой (() => { ... })().
Ключевое слово здесь «выражение». Строка, начинающаяся с function, разбирается как объявление, а объявление нельзя вызвать на месте. Скобки вокруг переводят функцию в контекст выражения. Тот же эффект дают !function () {}() и void function () {}(), их можно встретить в минифицированном коде.
Зачем приём был нужен:
- изоляция области видимости: до ES2015 у
varбыла только функциональная область, и IIFE была главным способом не засорятьwindow; - паттерн «модуль»: функция возвращает объект с публичными методами, а переменные внутри замыкания остаются приватными. Так были устроены jQuery-плагины и библиотеки того времени;
- захват значения в цикле: классическая задача с
setTimeoutвнутриfor (var i ...), где IIFE фиксировала текущееi; - передача зависимостей:
(function ($, win) { ... })(jQuery, window).
Что сейчас. ES-модули дают каждому файлу свою область, let и const дают блочную. Бандлеры сами оборачивают код, а формат iife у Rollup и esbuild остался для сборки под обычный тег <script>. В ручном коде живым остался async IIFE (async () => { await ... })() там, где нет top-level await, например в CommonJS-скрипте.
Где спотыкаются
Не могут объяснить, зачем нужны скобки. Ответ «так принято» слабый, интервьюер ждёт разговора про объявление и выражение.
Забывают точку с запятой перед IIFE. Если предыдущая строка не закрыта ;, открывающая скобка приклеится к ней как вызов, и вы получите TypeError вида «... is not a function».
Путают IIFE с замыканием или называют её обязательной в современном коде. Замыкание это механизм, IIFE лишь один из способов его создать, а изоляцию сегодня дают модули и блочные переменные.