Formas de escrever Immediately Invoked Function Expression (IIFE) no JavaScript

Nota: apenas traduzi o texto abaixo e postei aqui.

Uma Immediately Invoked Function Expression, ou IIFE, é uma function que se invoca imediata e automaticamente e executa o código dentro dela.

Isso permite manter o código fora do escopo global sem precisar nomear e chamar uma function.

Algo que confunde muitas pessoas é que existem várias maneiras de escrever uma IIFE. Hoje, veremos algumas variações de como ela é escrita.

"Leading" semicolon

Às vezes você as vê com um ponto e vírgula inicial.

;(function () {
    // O código vai aqui...
})();

Isso existe para que, se alguém esquecer um ponto e vírgula final após a definição de uma variável, e sua function terminar na mesma linha que ela, seu código não será quebrado.

// Isso causaria um error
var greeting = 'Hi there!'(function () {
    // O código vai aqui...
})();

// Isso não causará
var greeting = 'Hi there!';(function () {
    // O código vai aqui...
})();

Localização diferente para os parênteses

Às vezes, você também vê os segundos parênteses dentro dos primeiros, em vez de depois deles. Isso funciona da mesma maneira, e algumas pessoas preferem essa aparência (eu não).

(function () {
    // O código vai aqui...
}());

Passando variables para dentro

Você também poderá ver pessoas passando os elementos document e window como variáveis nomeadas. Isso permite que você use facilmente nomes de variáveis mais curtos para elas em seu código.

Pessoalmente, prefiro ser mais explícito e usar os nomes completos desses elementos, mas essa abordagem também é adequada.

(function (doc, win) {
    // O código vai aqui...
}(document, window));

Às vezes, você também verá pessoas incluindo undefined como um terceiro argument que não é transmitido. Isso evita que as pessoas sobrescrevam undefined como um valor fora do seu script. Imagino que isso fosse possível em versões mais antigas dos navegadores.

(function (doc, win, undefined) {
    // O código vai aqui...
}(document, window));

Qual você deve usar?

Prefiro estruturar minhas IIFEs o mínimo possível, com parênteses no final e ponto e vírgula de fechamento.

(function () {
    // O código vai aqui...
})();

Mas todas estas diferentes formas de escrever um IIFE estão corretas. Escolha o que você mais gosta.

Fonte

Newsletter de Go Make Things