Arrays são um dos tipos de dados mais usados em programação — praticamente todo programa precisa lidar com listas de coisas em algum momento. JavaScript tem uma API de arrays incrivelmente rica, e três métodos em particular transformam a forma como você escreve código: map, filter e reduce. Entender esses três elimina a necessidade de loops manuais em 90% dos casos e produz código mais legível e menos propenso a bugs.
Criando e acessando arrays
Arrays em JavaScript são criados com colchetes: const notas = [8.5, 7.0, 9.2, 6.8];. Acesso pelo índice (começando em 0): notas[0] retorna 8.5. notas.length retorna o tamanho. Métodos básicos: .push(valor) adiciona ao final, .pop() remove do final, .shift() remove do início, .unshift(valor) adiciona ao início. .indexOf(valor) retorna o índice da primeira ocorrência ou -1 se não encontrar. .includes(valor) retorna true/false.
Diferente de linguagens fortemente tipadas, arrays JavaScript podem conter tipos mistos — mas na prática você quase sempre vai ter arrays homogêneos (todos strings, todos números, todos objetos). Arrays de objetos são onipresentes: uma lista de usuários, um carrinho de compras, resultados de uma API — todos chegam como array de objetos.
map: transformando cada elemento
.map(callback) cria um novo array aplicando a função a cada elemento do array original, sem modificar o original. Para dobrar todos os números: const dobrados = notas.map(n => n * 2);. Para extrair apenas o nome de um array de pessoas: const nomes = pessoas.map(p => p.nome);. Para formatar preços: const precos = valores.map(v => `R$ ${v.toFixed(2)}`);.
O map segue o princípio de imutabilidade: ele nunca modifica o array original, sempre retorna um novo array. Isso é importante para evitar bugs sutis onde você acidentalmente modifica dados compartilhados. O callback recebe três argumentos: o elemento atual, o índice e o array — na maioria dos casos você só precisa do primeiro.
filter: selecionando elementos
.filter(callback) cria um novo array com apenas os elementos para os quais a função retorna true. Para manter apenas as notas aprovadas: const aprovados = notas.filter(n => n >= 7);. Para filtrar usuários ativos: const ativos = usuarios.filter(u => u.ativo === true);. Para buscar por texto: const resultado = produtos.filter(p => p.nome.toLowerCase().includes(busca.toLowerCase()));.
Filter também recebe índice e array como argumentos adicionais. Uma combinação muito comum é filter + map: primeiro filtra os itens relevantes, depois transforma. const nomesAprovados = alunos.filter(a => a.nota >= 7).map(a => a.nome); — isso é chamado de method chaining (encadeamento de métodos) e é idiomático no JavaScript moderno.
reduce: acumulando em um único valor
.reduce(callback, valorInicial) é o mais poderoso e o mais intimidador dos três. Ele percorre o array acumulando um resultado. O callback recebe dois argumentos principais: o acumulador (o resultado construído até agora) e o elemento atual. Para somar todos os números: const soma = notas.reduce((acc, n) => acc + n, 0);. O segundo argumento de reduce é o valor inicial do acumulador — aqui, 0.
Mas reduce vai muito além de somas: pode construir objetos, agrupar dados, e transformar arrays em qualquer estrutura. Contar ocorrências de valores: const contagem = frutas.reduce((acc, f) => { acc[f] = (acc[f] || 0) + 1; return acc; }, {}); — retorna um objeto onde cada chave é uma fruta e o valor é quantas vezes aparece. Esse padrão de redução para objeto é extremamente útil no dia a dia.
Outros métodos importantes
.find(callback) retorna o primeiro elemento que satisfaz a condição (não um array, o elemento em si). .findIndex(callback) retorna o índice do primeiro match. .some(callback) retorna true se pelo menos um elemento satisfaz. .every(callback) retorna true se TODOS satisfazem. .sort(comparador) ordena — atenção: o sort padrão converte para string, então para números você precisa passar um comparador: .sort((a, b) => a - b).
.flat() achata um array de arrays em um único nível. .flatMap(callback) é um map seguido de flat, comum para quando o map retorna arrays. .slice(inicio, fim) retorna um subarray sem modificar o original (diferente de .splice que modifica). Dominar a API de arrays do JavaScript é um multiplicador de produtividade enorme — você vai escrever menos código, mais legível, e com menos bugs do que com loops manuais tradicionais.
Tem um projeto em mente?
Somos especialistas em transformar ideias em produtos digitais. Apps, sites, automações e IA — vamos construir juntos.
