Pílulas de JavaScript: função que retorna outra função

Photo by TheThinkSomeMoreStore

[click here for English]

Este é um post de uma série na qual compartilho alguns aprendizados da minha jornada no JavaScript no formato de mini artigos. Veja os posts anteriores no meu perfil!

Uma função que retorna outra função é um tipo de função de ordem superior. Observe o exemplo abaixo:

function outerFunction () {
  alert('Hello!');

  return function () {
    alert('Can you hear me?');
  };
}

Apesar do que possa parecer, se nós simplesmente invocarmos a função externa com outerFunction(), veremos apenas o primeiro alerta 'Hello!'; o código da função interna não será executado. Precisaremos de algum truque específico se quisermos disparar o segundo alerta!

Há duas formas de executar a função retornada. Uma opção é colocar a função externa outerFunction em uma variável. Por baixo dos panos, estaremos na verdade guardando o retorno da função:

const innerFunction = outerFunction();

Agora, podemos invocar essa nova variável como qualquer outra função e somente a função retornada será executada:

innerFunction();
// alerta 'Can you hear me?'

Outra alternativa é invocar a função imediatamente, sem a necessidade de criar uma variável. Basta adicionar outro conjunto de parênteses à chamada da função externa:

outerFunction()();
// alerta 'Hello!' e depois alerta 'Can you hear me?'

Observe que o efeito, nesse caso, é diferente do primeiro exemplo. Aqui, o primeiro par de parênteses executa a função outerFunction e retorna a função interna que, então, é invocada pelo segundo par de parênteses!

Devemos escolher uma abordagem avaliando a necessidade de se executar ou não o conteúdo da função externa, antes que o conteúdo da função retornada seja executado.

Por hoje é só e até a próxima ❤