Os arrays são uma das estruturas de dados mais importantes em JavaScript. Eles permitem armazenar listas de informações e, com os métodos certos, podemos manipular dados de forma simples e eficiente. Neste guia sobre manipulando arrays JavaScript, vamos explorar os métodos mais utilizados, sempre com exemplos práticos.

🔗 Saiba mais sobre arrays na documentação oficial do MDN.

1. map() — Transformando o array! 🛠️

O map() é ideal para transformar os elementos de um array em algo novo, mantendo o mesmo tamanho do array original. Imagine que você tem uma lista de números e quer dobrar cada um deles:

const numeros = [1, 2, 3, 4, 5];
const numerosDobrados = numeros.map(num => num * 2);

console.log(numerosDobrados); // [2, 4, 6, 8, 10]

💡 Dica: O map() não altera o array original. Ele cria um novo array!

2. filter() — Filtrando o que interessa! 🔍

Se você precisa filtrar elementos de um array com base em alguma condição, filter() é o método certo. Ele retorna um novo array contendo apenas os elementos que passam no teste da função.

const idades = [18, 21, 16, 30, 25];
const adultos = idades.filter(idade => idade >= 18);

console.log(adultos); // [18, 21, 30, 25]

🎯 Objetivo: Filtrar elementos que atendem a uma condição específica.

3. reduce() — Reduzindo para um valor só! 🧠

Quando você quer pegar todos os elementos de um array e reduzi-los a um único valor (como somar todos os números), reduce() é perfeito.

const precos = [10, 20, 30];
const total = precos.reduce((acumulado, precoAtual) => acumulado + precoAtual, 0);

console.log(total); // 60

📦 Legal, né? Agora você tem o total de todos os preços! 🎉

4. forEach() — Iterando com estilo! 🌀

O forEach() é útil quando você quer apenas iterar sobre o array e executar uma ação para cada elemento, sem retornar um novo array.

const frutas = ["🍎", "🍌", "🍇"];
frutas.forEach(fruta => {
  console.log(`Eu amo ${fruta}`);
});

🌟 Diferente do map(): O forEach() não retorna um novo array. Ele apenas percorre e executa algo em cada elemento.

5. find() — Procurando algo específico! 🕵️‍♂️

O find() retorna o primeiro elemento do array que satisfaz a condição fornecida. Se nenhum elemento for encontrado, retorna undefined.

const carros = ["Ferrari", "Tesla", "Fiat", "BMW"];
const carroLuxo = carros.find(carro => carro === "Ferrari");

console.log(carroLuxo); // Ferrari


Conclusão

Saber manipular arrays JavaScript é essencial para qualquer desenvolvedor. Com métodos como map, filter, reduce, forEach e find, você consegue trabalhar com listas de dados de forma eficiente e elegante.

Se quiser aprender mais, confira também nosso artigo sobre funções de ordem superior em JavaScript para aprofundar seu conhecimento.