Explique porque o seguinte não funciona como um IIFE: `function foo(){ }();`. O que precisa ser alterado para torná-lo corretamente um IIFE?

IIFE significa expressões de função imediatamente invocadas. O interpretador JavaScript lê function foo(){ }(); como function foo(){ } e ();, onde o primeiro é uma declaração de função e o último (um par de parênteses) é uma tentativa de chamar uma função, mas não há nome especificado, portanto, ele retorna Uncaught SyntaxError: Unexpected token ).

Aqui estão duas maneiras de corrigir que envolve a adição de mais parênteses: (function foo(){ })() e (function foo(){ }()). Declarações que começam com function são consideradas como function declarations ao envolver essa função dentro de (), ela se torna uma function expression que pode ser executada com o () subsequente. Essas funções não são expostas no escopo global e você pode até omitir o nome delas se não precisar fazer referência a si mesmas dentro do corpo.

Você também pode usar o operador void: void function foo(){ }();. Infelizmente, há um problema com essa abordagem. A avaliação da expressão fornecida é sempre undefined, então, se sua função IIFE retornar algo, você não poderá usá-la. Um exemplo:

const foo = void (function bar() {
  return 'foo';
})();

console.log(foo); // indefinido