Método filter() em JavaScript: Filtrando Itens de um Array

POV: Você usou filter() e só os pares passaram 😎

Partindo do mesmo array de notas dos vídeos anteriores, criamos um segundo array chamado "resultado dois" usando filter(). Para cada nota, testamos se o resto da divisão por 2 é igual a zero — se for, essa nota é par e entra no novo array; se não for, ela fica de fora. O resultado é um array só com os números pares da lista original. Trocando a condição (testando se existe resto na divisão), o mesmo filter() passa a devolver só os números ímpares.

"Eu vou pegar o resultado e na verdade notas novamente. Vou criar um resultado dois com notas. Só que dessa vez a gente vai fazer um filtro. Esse filter aqui vai só me trazer as notas que são pares."

🗺️ O que é o método filter() em JavaScript?

O método filter() é uma das funções de alta ordem mais poderosas do JavaScript . Ele cria um novo array contendo apenas os elementos que passam em um teste definido por uma função . Diferente do map(), que transforma todos os elementos mantendo o tamanho, o filter() pode reduzir o array .

// array.filter(função_callback)
const novoArray = arrayOriginal.filter(elemento => {
    // Retorna true para manter, false para descartar
    return elemento > 10;
});
        

📊 Exemplo prático: filter() com notas pares

Vamos aplicar o filter() em um array de notas para selecionar apenas as notas pares .

// Array original
const notas = [1, 2, 3, 4, 5];

// Usando filter() para selecionar números pares
const resultado = notas.filter(n => {
    return n % 2 === 0;
});

console.log(resultado);
// Saída: [2, 4]
        

⚖️ filter() vs map() — Qual usar?

const resultado = numeros.map(n => n * 2);
// [2, 4, 6, 8, 10] (mesmo tamanho)
            

const resultado = numeros.filter(n => n % 2 === 0);
// [2, 4] (pode ser menor)
            

📚 Exemplos práticos de filter()

1. Filtrando números ímpares

const numeros = [1, 2, 3, 4, 5];
const impares = numeros.filter(n => n % 2 !== 0);
console.log(impares); // [1, 3, 5]
        

2. Filtrando objetos por propriedade

const produtos = [
    { nome: "Notebook", preco: 3000, estoque: 5 },
    { nome: "Mouse", preco: 50, estoque: 0 },
    { nome: "Teclado", preco: 200, estoque: 10 },
];

// Filtrar produtos com estoque > 0
const disponiveis = produtos.filter(p => p.estoque > 0);
console.log(disponiveis);
// [{nome: "Notebook", preco: 3000, estoque: 5}, {nome: "Teclado", preco: 200, estoque: 10}]
        

📋 Boas práticas com filter()

⏱️ Capítulos do vídeo

• 00:00 — Introdução: Preparando a variável resultado para receber o filtro
• 00:09 — Sintaxe: Utilizando o método .filter() no array de notas
• 00:14 — Lógica do filtro: Definindo o parâmetro (usando n) para percorrer a matriz
• 00:25 — Condição de filtragem: Filtrando apenas números pares (n % 2 === 0)
• 00:33 — Teste prático: Verificando o resultado no console
• 00:39 — Dica extra: Como filtrar números ímpares alterando a lógica
• 00:46 — Encerramento e convite para inscrição no canal

🎯 Conclusão

O método filter() é uma ferramenta essencial para qualquer programador JavaScript . Ele permite selecionar dados de forma elegante e funcional, sem modificar o dado original .

Neste artigo, você aprendeu:

• ✅ O que o método filter() faz em um array
• ✅ Como o filter() cria um novo array só com itens aprovados
• ✅ Como usar o resto da divisão (mod) para filtrar números pares
• ✅ Como trocar a condição para filtrar números ímpares
• ✅ A diferença entre filter() e map() na prática
• ✅ Onde o filter() costuma ser usado no dia a dia

🤔 O que você achou?

💬 Quer aprender JavaScript do ZERO? Comece agora a escrever seu primeiro código e seus fundamentos!

❓ FAQ: Perguntas Frequentes sobre o Método Filter() em JavaScript

🎬 Assista ao Vídeos completo sobre Refatoração

O vídeo foi feito em Javascript mais o conceito pode ser utilizado em qualquer outra linguagem de programação..

🔗 Conecte-se Comigo