Notice: This page requires JavaScript to function properly.
Please enable JavaScript in your browser settings or update your browser.Aprenda Transformando Arrays com o Método map() | Métodos Avançados de Arrays e Transformações
Estruturas de Dados em JavaScript

bookTransformando Arrays com o Método map()

Esta seção aborda métodos essenciais de arrays utilizados no desenvolvimento diário: map(), filter(), find(), reduce() e sort(). Vamos começar com o map().

Para uma lista completa de todos os métodos de array, consulte a documentação oficial do MDN.

map()

O método map() percorre cada elemento de um array e cria um novo array com base no valor retornado pela função de callback.

array.map((element, index, array) => {
  // Callback body
});
  • element: item atual;
  • index: posição no array;
  • array: o array original.

              
12345

            
const products = ["Ball", "Shoes", "Mouse"];

const modifiedProducts = products.map((element, index, array) => {
  console.log(`Element: ${element}, Index: ${index}, Array: ${array}`);
});
copy

Pontos-chave sobre o map():

  • Processa cada elemento;
  • Não modifica o array original;
  • Retorna um novo array;
  • O array resultante possui o mesmo comprimento.

Transformação de Elementos do Array

O método map() é ideal quando é necessário transformar cada elemento de um array sem modificar o array original. Considere o exemplo a seguir:


              
12345678910

            
const numbers = [3, 5, 11, 32, 87];

/* Use the `map` method to create a new array (`doubledNumbers`) 
  by doubling each element of the `numbers` array. */
const doubledNumbers = numbers.map((element) => {
  return element * 2;
});

console.log("Initial array:", numbers); // Output: 3, 5, 11, 32, 87
console.log("Modified array:", doubledNumbers); // Output: 6, 10, 22, 64, 174
copy

1. O que o método map() faz?

2. Qual é uma característica fundamental do método map()?

3. No exemplo abaixo, o que strings.map((element) => (element += "!")) faz?

question mark

O que o método map() faz?

Select the correct answer

question mark

Qual é uma característica fundamental do método map()?

Select the correct answer

question mark

No exemplo abaixo, o que strings.map((element) => (element += "!")) faz?

Select the correct answer

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 5. Capítulo 1

Pergunte à IA

expand

Pergunte à IA

ChatGPT

Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo

bookTransformando Arrays com o Método map()

Deslize para mostrar o menu

Esta seção aborda métodos essenciais de arrays utilizados no desenvolvimento diário: map(), filter(), find(), reduce() e sort(). Vamos começar com o map().

Para uma lista completa de todos os métodos de array, consulte a documentação oficial do MDN.

map()

O método map() percorre cada elemento de um array e cria um novo array com base no valor retornado pela função de callback.

array.map((element, index, array) => {
  // Callback body
});
  • element: item atual;
  • index: posição no array;
  • array: o array original.

              
12345

            
const products = ["Ball", "Shoes", "Mouse"];

const modifiedProducts = products.map((element, index, array) => {
  console.log(`Element: ${element}, Index: ${index}, Array: ${array}`);
});
copy

Pontos-chave sobre o map():

  • Processa cada elemento;
  • Não modifica o array original;
  • Retorna um novo array;
  • O array resultante possui o mesmo comprimento.

Transformação de Elementos do Array

O método map() é ideal quando é necessário transformar cada elemento de um array sem modificar o array original. Considere o exemplo a seguir:


              
12345678910

            
const numbers = [3, 5, 11, 32, 87];

/* Use the `map` method to create a new array (`doubledNumbers`) 
  by doubling each element of the `numbers` array. */
const doubledNumbers = numbers.map((element) => {
  return element * 2;
});

console.log("Initial array:", numbers); // Output: 3, 5, 11, 32, 87
console.log("Modified array:", doubledNumbers); // Output: 6, 10, 22, 64, 174
copy

1. O que o método map() faz?

2. Qual é uma característica fundamental do método map()?

3. No exemplo abaixo, o que strings.map((element) => (element += "!")) faz?

question mark

O que o método map() faz?

Select the correct answer

question mark

Qual é uma característica fundamental do método map()?

Select the correct answer

question mark

No exemplo abaixo, o que strings.map((element) => (element += "!")) faz?

Select the correct answer

Tudo estava claro?

Como podemos melhorá-lo?

Obrigado pelo seu feedback!

Seção 5. Capítulo 1
some-alt