Phenquestions
Do array método de mapa é usado para construir uma nova matriz mapeada com base no valor de retorno da função de retorno de chamada para cada elemento.
var mappedArray = array.map (callbackFunction, thisValue)O ligue de volta é a função que será chamada todas as vezes para um único elemento e retornará um valor que será armazenado em um novo array. A sintaxe para a função de retorno de chamada é
função (valor, [índice [, matriz]])valor é um argumento necessário, que é na verdade um único elemento da matriz.
O índice é um argumento opcional que será usado como o índice de cada elemento na função de retorno de chamada.
O variedade também é um argumento opcional. Podemos passar este argumento se quisermos usar a matriz na função de retorno de chamada.
thisValue é o valor que queremos passar, que será usado como um "this" na função de retorno de chamada. Caso contrário, "indefinido" será aprovado.
Javascript fornece o loop for… in e foreach para iterar através de elementos e manipular matrizes. Mas, por que precisamos de um método de mapa além desse? Existem duas razões principais para isso. Um é a separação de interesses e o segundo é a sintaxe fácil para fazer tais tarefas. Então, vamos tentar alguns exemplos diferentes para demonstrar o propósito e o uso correto dele.
Exemplos
Em primeiro lugar, teremos uma demonstração simples na qual temos um array simples de números no qual tentaremos realizar qualquer operação aritmética simples sobre cada elemento.
var arr = [4, 8, 16, 64, 49];Agora, antes de aplicar o método map sobre este array. Vamos primeiro escrever uma função de retorno de chamada para a qual podemos chamar nossa função de mapa na qual, digamos que queremos multiplicar cada elemento por 10 e ter um novo array.
função multiplicar (elemento)var newElement = element * 10;
return newElement;
Tudo está configurado para aplicar o método de mapa sobre a matriz e ter os resultados necessários.
var newArr = arr.mapear (multiplicar);Agora, se dermos uma olhada no “newArr”,
console.log (newArr);Podemos ver a última matriz mapeada na saída de acordo com nossos requisitos.
Tenha isso em mente que o comprimento da nova matriz mapeada será definitivamente igual à matriz original.
Existe uma maneira mais curta de fazer a mesma tarefa usando a seta ou função anônima dentro de um método de mapa. Então, podemos escrever uma função de retorno de chamada dentro de um método de mapa como este
var newArr = arr.mapa ((elemento) =>elemento de retorno * 10
)
Ou, se quisermos ser profissionais e torná-lo mais conciso. Nós podemos fazer isso
var newArr = arr.mapa (e => e * 10)Bem! Então, esta foi a demonstração básica do método map e diferentes maneiras de escrever a função de retorno de chamada. Mas, essa função é mais útil, quando estamos brincando com uma variedade de objetos. É aí que a verdadeira implementação acontece.
Usando o mapa com uma matriz de objetos
Neste exemplo, supomos uma matriz de objetos em que cada objeto contém as informações de um jogador. O nome do jogador e seu ID.
var arr = [id: 12, nome: "James",
id: 36, nome: "Morgan",
id: 66, nome: "Jordan"
];
Agora, digamos que queremos extrair os IDs de cada objeto e ter uma nova matriz de IDs.
Mas, para entender, como o método do mapa é diferente e ajuda melhor do que o loop foreach. Tentaremos ambos (método de mapa e loop foreach) para fazer a mesma tarefa e aprender a diferença.
Então, primeiro, vamos tentar extrair IDs usando o loop foreach e, em seguida, usando o método map.
var extractIDs = [];arr.forEach ((elemento) =>
retornar IDs extraídos.push (elemento.eu ia);
)
Agora, se dermos uma olhada nos IDs extraídos.
console.log (IDs extraídos);
Nós os separamos em uma matriz. Mas, agora vamos demonstrar a mesma saída usando o método map.
elemento de retorno.eu ia;
)
console.log (IDs extraídos);
Observando a diferença no código e a mesma saída, podemos perceber a verdadeira diferença entre os dois métodos (foreach e map). A sintaxe e separação de interesses.
Da mesma forma, podemos realizar muitas outras operações. Se tivermos que jogar e obter alguns dados do conjunto de objetos. Supomos uma matriz de objetos em que cada objeto contém duas propriedades: nome e sobrenome.
var arr = [firstName: "John", lastName: "Doe",
firstName: "Morgan", lastName: "Freeman",
firstName: "Jordan", lastName: "Peterson"
];
Agora, queremos ter uma matriz que contenha os nomes completos. Então, vamos escrever uma função de mapa como esta para cumprir nosso propósito
var fullName = arr.mapa ((pessoa) =>pessoa de retorno.primeiroNome + "+ pessoa.sobrenome
)
console.log (fullName);
Como você pode ver, temos uma matriz separada com nomes completos. Isso é ótimo.
Então, essas são algumas das maneiras básicas e diferentes de como uma função de mapa pode ser usada para atender aos nossos requisitos de desenvolvimento e ajuda na vida de cada desenvolvedor de javascript.
Conclusão
Neste artigo, aprendemos sobre o método map () mais usado do javascript para matrizes e aprendemos algumas das diferentes maneiras de usar o método map. Este artigo explica o conceito do método do mapa de uma maneira tão fácil e profunda que qualquer programador iniciante pode entendê-lo e utilizá-lo para suas necessidades. Portanto, continue aprendendo, trabalhando e obtendo experiência em javascript com linuxhint.com para ter um melhor domínio sobre isso. Muito obrigado!
