0Pricing
JavaScript Academy · Aula

map e filter — fundamentos

Transforme e selecione dados com map e filter; encadeie-os e evite mutações para escrever um código mais seguro

map e filter — fundamentos é uma aula grátis de JavaScript Academy no CoddyKit. Esta é a aula 1 de 2. Você pode ler a aula completa abaixo gratuitamente — depois pratica ao vivo no navegador com um editor de código integrado e um tutor de IA 24/7. Faz parte do caminho de aprendizado de JavaScript Academy, e seu progresso é sincronizado entre a web e o app CoddyKit. O curso de JavaScript Academy inclui 2 aulas no total.

Introdução a map e filter

Objetivo: transforme itens com map e selecione itens com filter.

  • map: transformar
  • filter: selecionar
  • Encadear map → filter
  • Sem mutação
map e filter — fundamentos — ilustração 1

Noções básicas de map

map aplica uma função a cada elemento e retorna uma nova matriz (com o mesmo tamanho).

// map transforms each value and returns a new array
const nums = [1, 2, 3];

const doubled = nums.map(function (n) {
  return n * 2;
});

console.log("nums:", nums);
console.log("doubled:", doubled);
map e filter — fundamentos — ilustração 2

Noções básicas de filter

filter retorna apenas os itens para os quais sua função de retorno de chamada retorna true (o tamanho pode mudar).

// filter keeps values that pass the test
const values = [1, 2, 3, 4, 5];

const evens = values.filter(function (n) {
  return n % 2 === 0;
});

console.log("values:", values);
console.log("evens:", evens);
map e filter — fundamentos — ilustração 3

Exemplo de encadeamento

Combine as etapas: use map para transformar e depois filter para selecionar.

// Chain methods for clarity
const prices = [4, 7, 10];

// First add tax, then keep items over 8
const withTax = prices.map(function (p) {
  return p * 1.1;
});

const expensive = withTax.filter(function (p) {
  return p > 8;
});

console.log("withTax:", withTax);
console.log("expensive:", expensive);
map e filter — fundamentos — ilustração 4

Demonstração sem mutação

Imutabilidade: map/filter retornam novas matrizes; o original permanece inalterado.

// map and filter do not mutate the original array
const base = [2, 4, 6];

const plusOne = base.map(function (n) {
  return n + 1;
});

const small = base.filter(function (n) {
  return n < 5;
});

console.log("base:", base);
console.log("plusOne:", plusOne);
console.log("small:", small);
map e filter — fundamentos — ilustração 5

Dicas para matrizes claras

Dicas:

  • Dê bons nomes às pequenas funções de retorno de chamada (n, item) para facilitar a compreensão.
  • Mantenha os encadeamentos curtos (no máximo 2 ou 3 etapas).
  • Prefira funções de retorno de chamada puras (sem efeitos colaterais).
map e filter — fundamentos — ilustração 6

Quiz sobre map e filter

Verificação rápida: transforme cada elemento.

map e filter — fundamentos — ilustração 7

Recapitulação

Recapitulação: Use map para transformar valores, filter para selecionar alguns e encadeie-os sem alterar a matriz original.

map e filter — fundamentos — ilustração 8

Perguntas Frequentes

A aula “map e filter — fundamentos” é grátis?

Sim — o texto completo de “map e filter — fundamentos” é grátis para ler aqui na web. Para praticá-la interativamente (um editor de código integrado e um tutor de IA 24/7) e desbloquear o restante do curso de JavaScript Academy, atualize para CoddyKit PRO. O curso de JavaScript Academy inclui 2 aulas no total.

O que vou aprender em “map e filter — fundamentos”?

Transforme e selecione dados com map e filter; encadeie-os e evite mutações para escrever um código mais seguro Você pratica JavaScript Academy com código prático que executa diretamente no navegador, e um tutor de IA 24/7 responde suas dúvidas enquanto trabalha na aula.

Preciso ter experiência prévia para começar JavaScript Academy?

Nenhuma experiência prévia é necessária. JavaScript Academy no CoddyKit é estruturado para alunos iniciantes até avançados, então você pode começar aqui ou desde o início e aprender no seu ritmo. Esta é a aula 1 de 2.

Quanto tempo leva a aula “map e filter — fundamentos”?

A maioria das aulas CoddyKit leva cerca de 5–10 minutos. Cada uma é compacta e interativa, então você faz progresso constante e retoma exatamente de onde parou entre web e app.

Posso escrever e executar código nesta aula de JavaScript Academy?

Sim. Cada aula de JavaScript Academy inclui um editor de código integrado, então você escreve e executa código real direto no navegador e recebe feedback de IA instantaneamente — nenhuma configuração local necessária.

Todas as aulas deste curso

  1. map e filter — fundamentos
  2. reduce, some/every e find — padrões simples
← Voltar para JavaScript Academy