Como usar o método map() em arrays com JavaScript
O método map() é uma poderosa função nativa do JavaScript que permite percorrer e modificar elementos em um array de forma eficiente.
Publicado em 8 de agosto de 2023
Glossário
Usando o método map() em arrays com JavaScript
Sintaxe do método map() em JavaScript
A sintaxe básica do método map() é a seguinte:
array.map(callback(elementoAtual, índice, arrayOriginal) {
// código a ser executado
});
Nessa sintaxe, o parâmetro callback é a função que será aplicada a cada elemento do array. O elementoAtual representa o valor do elemento em cada iteração, o índice é a posição do elemento dentro do array e o arrayOriginal é o array em si.
Retornando um novo array com o método map() em JavaScript
Uma das grandes vantagens do método map() é a capacidade de retornar um novo array com base nas transformações aplicadas a cada elemento. Isso facilita muito a manipulação e transformação de dados, tornando o código mais legível e conciso.
Vamos supor que temos um array de números e queremos criar um novo array com o dobro de cada elemento. Podemos usar o método map() para isso.
const numeros = [1, 2, 3, 4, 5];
const numerosDobro = numeros.map(function(numero) {
return numero * 2;
});
console.log(numerosDobro);
// Output: [2, 4, 6, 8, 10]
Exemplos práticos de uso do método map() em arrays com JavaScript
Além de simples transformações matemáticas, o método map() pode ser aplicado em uma variedade de cenários. Vamos explorar alguns exemplos práticos para entender melhor seu potencial.
1. Mapeando valores de um array de objetos
Imagine que temos um array de objetos, cada um representando uma pessoa com o nome e a idade. Queremos criar um novo array apenas com os nomes das pessoas.
const pessoas = [
{ nome: 'João', idade: 25 },
{ nome: 'Maria', idade: 30 },
{ nome: 'Pedro', idade: 20 }
];
const nomesPessoas = pessoas.map(function(pessoa) {
return pessoa.nome;
});
console.log(nomesPessoas);
// Output: ["João", "Maria", "Pedro"]
2. Transformando strings para letras maiúsculas
Suponha que temos um array de strings e queremos transformar todas as letras em maiúsculas.
const palavras = ['gato', 'cachorro', 'passarinho'];
const palavrasMaiusculas = palavras.map(function(palavra) {
return palavra.toUpperCase();
});
console.log(palavrasMaiusculas);
// Output: ["GATO", "CACHORRO", "PASSARINHO"]
3. Trabalhando com datas
Outro exemplo interessante é a manipulação de datas. Suponha que temos um array de timestamps e queremos criar um novo array com as respectivas datas formatadas.
const timestamps = [1623904800000, 1623991200000, 1624077600000];
const datasFormatadas = timestamps.map(function(timestamp) {
const data = new Date(timestamp);
return data.toLocaleDateString();
});
console.log(datasFormatadas);
// Output: ["17/06/2021", "18/06/2021", "19/06/2021"]
Conclusão
O método map() é uma ferramenta poderosa do JavaScript que permite percorrer e transformar arrays de forma eficiente. Com ele, é possível criar novos arrays com base nas operações realizadas em cada elemento.
Ao entender a sintaxe e os conceitos por trás do método map(), você estará preparado para utilizar essa funcionalidade em seus projetos. Lembre-se de explorar diferentes exemplos e cenários para aprimorar suas habilidades e tirar o máximo proveito dessa poderosa ferramenta.
Portanto, ao desenvolver suas aplicações web com JavaScript, lembre-se de considerar o uso do método map() quando precisar percorrer e transformar elementos de arrays. Como usar o método map() em arrays com JavaScript é uma habilidade fundamental para otimizar suas tarefas de desenvolvimento e garantir a eficiência do seu código.
A Awari é a melhor plataforma para aprender sobre programação no Brasil.
Aqui você encontra cursos com aulas ao vivo, mentorias individuais com os melhores profissionais do mercado e suporte de carreira personalizado para dar seu próximo passo profissional e aprender habilidades como Data Science, Data Analytics, Machine Learning e mais.
Já pensou em aprender de maneira individualizada com profissionais que atuam em empresas como Nubank, Amazon e Google? Clique aqui para se inscrever na Awari e começar a construir agora mesmo o próximo capítulo da sua carreira em dados.
Aprenda uma nova língua na maior escola de idioma do mundo!
Conquiste a fluência no idioma que sempre sonhou com uma solução de ensino completa.
+ 400 mil alunos
Método validado
Aulas
Ao vivo e gravadas
+ 1000 horas
Duração dos cursos
Certificados
Reconhecido pelo mercado
Artigos Relacionados
Confira abaixo mais conteúdos sobre o tema
Curso Técnico Desenvolvedor de Sistemas: Aprenda a criar soluções tecnológicas
Um curso técnico desenvolvedor de sistemas é uma formação...
Curso Desenvolvedor Web em Curitiba: Aprenda a Programar e Construa sua Carreira
Curso Desenvolvedor Web Curitiba: Aprenda a programar, construa uma...
Curso Técnico de Desenvolvedor de Software: Aprenda as habilidades necessárias para se tornar um profissional de sucesso na área de desenvolvimento de software.
Resumo: Descubra os benefícios de fazer um curso técnico...
