Funções anônimas e Arrow Functions: formas modernas de escrever funções
Conheça estilos mais concisos e flexíveis para criar funções.
Até aqui, você criou funções com function nomeDaFuncao() { ... }.
Agora vamos conhecer duas formas muito usadas no JavaScript moderno:
- Funções anônimas (funções sem nome)
- Arrow Functions (funções com seta
=>)
Pense assim: você já aprendeu a escrever uma receita completa com título.
Agora vai aprender também a escrever versões mais rápidas da mesma receita.
1) O que é função anônima?
É uma função sem nome próprio, geralmente guardada em uma variável.
const saudacao = function () {
console.log("Olá!");
};
saudacao();
Aqui:
- a função não tem nome depois de
function; - quem “carrega” a função é a variável
saudacao.
2) Por que usar função anônima?
Porque ela é prática em cenários como:
- passar função como argumento;
- usar em eventos;
- criar lógica pontual sem precisar nomear tudo.
Exemplo:
setTimeout(function () {
console.log("Executou depois de 1 segundo");
}, 1000);
3) O que é Arrow Function?
É uma forma mais curta de escrever função, usando =>.
const saudacao = () => {
console.log("Olá com arrow!");
};
saudacao();
4) Comparando formas
Função tradicional
function somar(a, b) {
return a + b;
}
Função anônima
const somar = function (a, b) {
return a + b;
};
Arrow Function
const somar = (a, b) => {
return a + b;
};
As três podem resolver o mesmo problema.
5) Arrow com retorno curto (implícito)
Quando a função tem só uma expressão, você pode simplificar:
const dobro = n => n * 2;
console.log(dobro(5)); // 10
Sem chaves, o retorno já acontece automaticamente.
6) Casos comuns no dia a dia
Arrow functions aparecem muito com arrays:
const numeros = [1, 2, 3, 4];
const dobrados = numeros.map(n => n * 2);
console.log(dobrados); // [2, 4, 6, 8]
7) Atenção importante com this
Arrow function não cria seu próprio this.
Isso é ótimo em alguns casos, mas pode confundir em outros.
Para quem está começando, regra prática:
- use arrow para funções curtas e callbacks;
- em objetos e cenários com
this, teste com atenção.
8) Boas práticas
- Prefira nomes claros na variável que guarda a função.
- Use arrow para código curto e legível.
- Não escolha “porque é moderno”; escolha quando deixar mais claro.
- Mantenha consistência no projeto.
Resumo da lição
Função anônima é uma função sem nome direto, geralmente armazenada em variável.
Arrow function é uma sintaxe mais curta e moderna para escrever funções.
As duas ajudam a escrever código mais enxuto, especialmente em callbacks e manipulação de listas.