Métodos de Array

Por que usar métodos funcionais?

Você já percorreu arrays com for. Métodos funcionais fazem a mesma coisa, só que em menos código.

Regra de ouro: eles nunca mudam o array original; sempre devolvem algo novo.

filter: selecionar elementos

Pense num filtro de café: só passa o que interessa.

const notas: number[] = [8.5, 7.0, 9.5, 6.0, 5.5];

const aprovados = notas.filter((nota) => nota >= 7);
console.log(aprovados); // → [8.5, 7.0, 9.5]

const reprovados = notas.filter((nota) => nota < 7);
console.log(reprovados); // → [6.0, 5.5]

A função retorna true (fica) ou false (sai).

map: transformar cada elemento

Como uma fábrica: entra uma coisa, sai outra.

const notas: number[] = [8.5, 7.0, 9.5, 6.0, 5.5];

const arredondadas = notas.map((nota) => Math.round(nota));
console.log(arredondadas); // → [9, 7, 10, 6, 6]

const comBonus = notas.map((nota) => nota + 0.5);
console.log(comBonus); // → [9.0, 7.5, 10.0, 6.5, 6.0]

reduce: acumular um valor

Imagina somar todas as compras do carrinho numa única conta. Isso é o reduce.

const notas: number[] = [8.5, 7.0, 9.5, 6.0, 5.5];

const soma = notas.reduce((acumulador, nota) => acumulador + nota, 0);
console.log(soma); // → 36.5

const média = soma / notas.length;
console.log(média); // → 7.3

Recebe dois argumentos: uma função (acumulador, elementoAtual) é o valor inicial (0).

Exemplo: contar votos

const votos: string[] = ["A", "B", "A", "C", "B", "A"];

const contagem = votos.reduce((acc, voto) => {
  acc[voto] = (acc[voto] || 0) + 1;
  return acc;
}, {} as Record<string, number>);

console.log(contagem); // → { A: 3, B: 2, C: 1 }

find: encontrar o primeiro

Devolve o primeiro elemento que bate com a condição. Se não achar, devolve undefined.

const notas: number[] = [8.5, 7.0, 9.5, 6.0, 5.5];

const primeiraBaixa = notas.find((nota) => nota < 7);
console.log(primeiraBaixa); // → 6.0

const notaDez = notas.find((nota) => nota === 10);
console.log(notaDez); // → undefined

some e every: verificar condições

const notas: number[] = [8.5, 7.0, 9.5, 6.0, 5.5];

// some - ALGUM satisfaz?
const temReprovado = notas.some((nota) => nota < 7);
console.log(temReprovado); // → true

// every - TODOS satisfazem?
const todosAprovados = notas.every((nota) => nota >= 7);
console.log(todosAprovados); // → false

Ambos devolvem true ou false.

Encadeando métodos

Você pode ligar um método no outro, como peças de Lego:

const números: number[] = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10];

const resultado = números
  .filter((n) => n % 2 === 0)    // → [2, 4, 6, 8, 10]
  .map((n) => n * 3)             // → [6, 12, 18, 24, 30]
  .reduce((acc, n) => acc + n, 0); // → 90

console.log(resultado); // → 90

Referências

• Array.prototype.map() - MDN Web Docs - documentação de map, filter, reduce e outros métodos funcionais
• JavaScript Array Methods - W3Schools - tutorial interativo sobre filter, map, reduce, find, some e every
• Métodos de Array (map, filter, reduce) - Filipe Deschamps - vídeo explicando os principais métodos funcionais de arrays