Funções anônimas de JavaScript

Resumo : neste tutorial, você aprenderá sobre funções anônimas JavaScript que são funções sem nomes.

Introdução às funções anônimas do JavaScript

Uma função anônima é uma função sem nome. O seguinte mostra como definir uma função anônima:

(function () {
   //...
});Linguagem de código:  JavaScript  ( javascript )

Observe que se você não colocar a função anônima entre parênteses (), receberá um erro de sintaxe. Os parênteses ()tornam a função anônima uma expressão que retorna um objeto de função.

Uma função anônima não está acessível após sua criação inicial. Portanto, muitas vezes você precisa atribuí-lo a uma variável.

Por exemplo, o exemplo a seguir mostra uma função anônima que exibe uma mensagem:

let show = function() {
    console.log('Anonymous function');
};

show();Linguagem de código:  JavaScript  ( javascript )

Neste exemplo, a função anônima não possui nome entre a functionpalavra-chave e os parênteses ().

Como precisaremos chamar a função anônima posteriormente, atribuímos a função anônima à showvariável.

Como toda a atribuição da função anônima à variável show constitui uma expressão válida, você não precisa colocar a função anônima entre parênteses ().

Usando funções anônimas como argumentos

Na prática, muitas vezes você passa funções anônimas como argumentos para outras funções. Por exemplo:

setTimeout(function() {
    console.log('Execute later after 1 second')
}, 1000);Linguagem de código:  JavaScript  ( javascript )

Neste exemplo, passamos uma função anônima para a setTimeout()função. A setTimeout()função executa esta função anônima um segundo depois.

Observe que as funções são cidadãs de primeira classe em JavaScript. Portanto, você pode passar uma função para outra função como argumento.

Execução de função invocada imediatamente

Se quiser criar uma função e executá-la imediatamente após a declaração, você pode declarar uma função anônima como esta:

(function() {
    console.log('IIFE');
})();Linguagem de código:  JavaScript  ( javascript )

Saída:

IIFE

Como funciona.

Primeiro, defina uma expressão de função:

(function () {
    console.log('Immediately invoked function execution');
})Linguagem de código:  JavaScript  ( javascript )

Esta expressão retorna uma função.

Segundo, chame a função adicionando os parênteses finais ():

(function () {
    console.log('Immediately invoked function execution');
})();Linguagem de código:  JavaScript  ( javascript )

Às vezes, você pode querer passar argumentos para uma função anônima, como esta:

let person = {
    firstName: 'John',
    lastName: 'Doe'
};

(function () {
    console.log(person.firstName + ' ' + person.lastName);
})(person);Linguagem de código:  JavaScript  ( javascript )

Saída:

John Doe

Funções de seta

ES6 introduziu expressões de função de seta  que fornecem uma abreviação para declarar funções anônimas.

Por exemplo, esta função:

let show = function () {
    console.log('Anonymous function');
};Linguagem de código:  JavaScript  ( javascript )

… pode ser encurtado usando a seguinte função de seta:

let show = () => console.log('Anonymous function');Linguagem de código:  JavaScript  ( javascript )

Da mesma forma, a seguinte função anônima:

let add = function (a, b) {
    return a + b;
};Linguagem de código:  JavaScript  ( javascript )

… é funcionalmente equivalente à seguinte função de seta:

let add = (a, b) => a + b;   Linguagem de código:  JavaScript  ( javascript )

Resumo

• Funções anônimas são funções sem nomes.
• Usar funções anônimas pode ser argumentos de outras funções ou como execução de uma função imediatamente invocada.