techknow

Manipulando Arrays com Javascript: Principais Métodos com Exemplos 🚀

By Iorgen Wildrik27 de setembro de 2024
Imagem do post Manipulando Arrays com Javascript: Principais Métodos com Exemplos  🚀
IA
Facebook IconTwitter IconWhatsApp IconLinkedIn Icon

Arrays são uma das estruturas de dados mais importantes em JavaScript. Eles são ótimos para armazenar listas de dados e, com os métodos certos, podemos fazer quase tudo com eles! Hoje vamos explorar os métodos mais utilizados para manipular arrays em JavaScript, sempre com exemplos práticos.

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 os 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! Ele percorre o array e aplica uma função que acumula um resultado final.

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 fazer algo com 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 só 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, ele retorna undefined.

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

console.log(carroLuxo)