O método map() invoca a função callback passada por argumento para cada elemento do Array e devolve um novo (readaptada) Array como resultado.

Avaliando melhor, é um método que varre um array pegando cada dado especificado e readaptando os dados por si só ou em alguma estrutura.

• 🔎 Fontes

<aside> 💡 Pode ocorrer uma pequena confusão entre o forEach() e Map. Os dois percorrem a array, só que o Map faz uma transformação e retorna a mesma, já o forEach não, ele apenas percorre

</aside>

Características

• Não modifica o Array
• Se utiliza de uma função callback.
• Retorna uma outra Array
• Mapeia os valores readaptando o retorno dos dados.

Sintaxe

const array=[]

const newArrayExample=arrayExample.map((item,index,arr)=> condição dada)

objectExample: objeto (original) que estamos analisando

newObjectExample: objeto (retorno) readaptação dos dados.

Callback Function ( )⇒ (Parâmetros):

• item: dados que são iterados (obrigatório).
• **index: ****posição do item que está sendo iterado.
• array: é o próprio array que está sendo iterado.

Contexto

Agora chega de 'Lenga Lenga' e vamos colocar em prática essa maravilha que é o map().

toUpperCase ( ), Maiúsculo

Foi repassado para o sistema vários nomes próprios com letra minúscula a partir de um cadastro feito. O objetivo aqui é converter a primeira letra para maiúscula.

const setOfNames= ['maria', 'eduarda', 'rafael', 'yohanna', 'gabriel', 'jonas']
                                           
const setOfNamesToUpperCase = setOfNames.map(item => item.charAt(0).toUpperCase() + item.slice(1) )

console.log(setOfNamesToUpperCase)

• setOfNames: array que contém os dados iniciais
• setOfNamesToUpperCase: array com os dados modificados, readaptados (retorno)
• item =>: parâmetro passado para a Arrow Function, que é justamente os elementos iterados do array.
• item.charAt(0).toUpperCase() + item.slice(1): modificação, readaptação dada dos elementos iterados

<aside> 💡 charAt(index):

</aside>