Se variáveis são os substantivos de uma linguagem de programação, funções são os verbos. Elas encapsulam ações, permitem reutilização, tornam o código legível e são o bloco de construção central de qualquer aplicação JavaScript real. E JavaScript tem particularidades interessantes com funções que a diferenciam de linguagens como Java: funções são valores como qualquer outro e podem ser passadas, retornadas e guardadas.
Três formas de declarar funções
Function declaration — a sintaxe clássica: function soma(a, b) { return a + b; }. Uma particularidade: function declarations passam por “hoisting”, o que significa que você pode chamar a função antes de onde ela foi definida no arquivo. É contraintuitivo mas é como o JavaScript funciona.
Function expression — guardando a função em uma variável: const soma = function(a, b) { return a + b; };. Não passa por hoisting. Pode ou não ter nome (função anônima é o comum). Essa forma deixa explícito que funções são valores.
Arrow function — sintaxe moderna e compacta: const soma = (a, b) => a + b;. Com um único parâmetro, os parênteses são opcionais: const dobro = x => x * 2;. Com um único return sem bloco, o return é implícito. Para funções com múltiplas linhas: const calcular = (x) => { const resultado = x * 2; return resultado; };. Arrow functions são o padrão em JavaScript moderno e em frameworks como React.
A diferença crucial do this em arrow functions
Arrow functions não têm seu próprio this — elas herdam o this do contexto externo onde foram definidas. Funções regulares têm seu próprio this que muda dependendo de como são chamadas. Esse comportamento é fonte de muita confusão para iniciantes, especialmente ao trabalhar com event listeners e métodos de classes. Como regra prática: use arrow functions para callbacks e funções aninhadas; use function declarations ou expressions para métodos de objetos e quando precisar de this dinâmico.
Callbacks: funções como argumentos
Um callback é simplesmente uma função passada como argumento para outra função, que a chama em algum momento. O método setTimeout é o exemplo mais clássico: setTimeout(() => console.log("3 segundos depois!"), 3000). A arrow function é o callback — será chamada depois de 3000ms. O addEventListener dos browsers funciona da mesma forma: você passa uma função que será chamada quando o evento ocorrer.
Métodos de arrays como .map(), .filter(), .forEach() e .reduce() todos aceitam callbacks. numeros.map(n => n * 2) cria um novo array com cada número dobrado. numeros.filter(n => n > 10) mantém apenas os maiores que 10. numeros.reduce((acc, n) => acc + n, 0) soma todos os elementos. Esses quatro métodos substituem a maioria dos loops manuais em JavaScript moderno.
Parâmetros padrão e rest parameters
Parâmetros padrão funcionam como no Python: function saudar(nome, saudacao = "Olá") { ... }. Se o segundo argumento não for passado, usa “Olá”. Rest parameters (...args) capturam todos os argumentos restantes em um array: function soma(...numeros) { return numeros.reduce((acc, n) => acc + n, 0); } — essa função aceita qualquer quantidade de argumentos. O spread operator (...) tem efeito oposto: expande um array em argumentos individuais: Math.max(...[3, 1, 4, 1, 5]).
Closures: funções que lembram
Uma closure é quando uma função “lembra” das variáveis do escopo onde foi criada, mesmo após esse escopo ter encerrado. É um conceito assustador na teoria mas natural na prática. Um contador criado por uma função que retorna uma função interna: a função interna tem acesso ao contador mesmo depois da função externa ter terminado. Cada chamada à função externa cria um contador independente. Closures são a base de muitos padrões avançados do JavaScript — módulos, memoização, currying — e entendê-las é o que separa o JavaScript básico do JavaScript proficiente.
Dominar as funções JavaScript — todas as suas formas, callbacks, closures e métodos de array — é o que permite escrever código limpo e idiomático no ecossistema moderno. React inteiro é construído em torno de funções (componentes funcionais, hooks). Node.js é orientado a callbacks e async. Cada linha de JavaScript profissional usa esses conceitos. O investimento de entender funções profundamente retorna dividendos por toda a carreira.
Tem um projeto em mente?
Somos especialistas em transformar ideias em produtos digitais. Apps, sites, automações e IA — vamos construir juntos.
