Phenquestions
La matriz método de mapa se utiliza para construir una nueva matriz mapeada basada en el valor de retorno de la función de devolución de llamada para cada elemento.
var mappedArray = matriz.map (callbackFunction, thisValue)La llamar de vuelta es la función que se llamará cada vez para un solo elemento y devolverá un valor que se almacenará en una nueva matriz. La sintaxis de la función de devolución de llamada es
función (valor, [índice [, matriz]])valor es un argumento necesario, que en realidad es un solo elemento de la matriz.
La índice es un argumento opcional que se utilizará como índice de cada elemento en la función de devolución de llamada.
La formación es un argumento opcional también. Podemos pasar este argumento si queremos usar la matriz en la función de devolución de llamada.
este valor es el valor que queremos pasar, que se utilizará como "esto" en la función de devolución de llamada. De lo contrario, se pasará "indefinido".
Javascript proporciona el bucle for ... in y foreach para iterar a través de elementos y manipular matrices. Pero, ¿por qué necesitamos un método de mapa aparte de eso?? Hay dos razones principales para eso. Uno es la separación de preocupaciones y el segundo es la sintaxis fácil para realizar tales tareas. Entonces, probemos algunos ejemplos diferentes para demostrar el propósito y el uso correcto de la misma.
Ejemplos de
En primer lugar, vamos a tener una demostración simple en la que tenemos una matriz simple de números en la que intentaremos realizar cualquier operación aritmética simple sobre cada elemento.
var arr = [4, 8, 16, 64, 49];Ahora, antes de aplicar el método de mapa sobre esta matriz. Primero escribiremos una función de devolución de llamada a la que podamos llamar en nuestra función de mapa en la que, digamos, queremos multiplicar cada elemento por 10 y tener una nueva matriz.
función multiplicar (elemento)var newElement = elemento * 10;
return newElement;
Todo está configurado para aplicar el método de mapa sobre la matriz y tener los resultados requeridos.
var newArr = arr.mapa (multiplicar);Ahora, si echamos un vistazo al "newArr",
consola.log (newArr);Podemos ver la última matriz mapeada en la salida según nuestro requisito.
Tenga esto en cuenta que la longitud de la nueva matriz asignada definitivamente será igual a la matriz original.
Hay una forma más corta de hacer la misma tarea usando la flecha o la función anónima dentro de un método de mapa. Entonces, podemos escribir una función de devolución de llamada dentro de un método de mapa como este
var newArr = arr.mapa ((elemento) =>elemento de retorno * 10
)
O, si queremos ser un profesional y hacerlo más conciso. Podemos hacer esto
var newArr = arr.mapa (e => e * 10)Bien! Entonces, esta fue la demostración muy básica del método de mapa y las diferentes formas de escribir la función de devolución de llamada. Pero esta función es más útil cuando jugamos con una variedad de objetos. Ahí es donde ocurre la verdadera implementación.
Usando Map con una matriz de objetos
En este ejemplo, suponemos una matriz de objetos en la que cada objeto contiene la información de un jugador. Nombre del jugador y su identificación.
var arr = [id: 12, nombre: "James",
id: 36, nombre: "Morgan",
id: 66, nombre: "Jordan"
];
Ahora, digamos que queremos extraer las ID de cada objeto y tener una nueva matriz de ID.
Pero, para entender, cómo el método del mapa es diferente y ayuda mejor que el bucle foreach. Intentaremos ambos (método de mapa y bucle foreach) para hacer la misma tarea y aprender la diferencia.
Entonces, primero, intentaremos extraer las ID usando el bucle foreach y luego usando el método de mapa.
var EXTRACTIDs = [];arr.forEach ((elemento) =>
devolver ID extraídos.empujar (elemento.identificación);
)
Ahora, si echamos un vistazo a los ID extraídos.
consola.log (ID extraídos);
Los tenemos separados en una matriz. Pero, ahora demostremos el mismo resultado usando el método de mapa.
elemento de retorno.identificación;
)
consola.log (ID extraídos);
Al observar la diferencia en el código y el mismo resultado, podemos darnos cuenta de la verdadera diferencia entre los dos métodos (foreach y map). La sintaxis y la separación de preocupaciones.
Del mismo modo, podemos realizar muchas otras operaciones. Si tenemos que jugar y obtener algunos datos de la matriz de objetos. Suponemos una matriz de objetos en la que cada objeto contiene dos propiedades: nombre y apellido.
var arr = [firstName: "John", lastName: "Doe",
firstName: "Morgan", lastName: "Freeman",
firstName: "Jordan", lastName: "Peterson"
];
Ahora, queremos tener una matriz que contenga los nombres completos. Entonces, escribiremos una función de mapa como esta para cumplir con nuestro propósito
var fullName = arr.mapa ((persona) =>persona de regreso.nombre + "+ persona.apellido
)
consola.log (fullName);
Como puede ver, tenemos una matriz separada con nombres completos. Genial.
Por lo tanto, estas son algunas de las formas básicas y diferentes de cómo se puede usar una función de mapa para cumplir con nuestros requisitos de desarrollo y ayudar en la vida de todos los desarrolladores de JavaScript.
Conclusión
En este artículo, hemos aprendido sobre el método map () más utilizado de javascript para matrices y hemos aprendido algunas de las diferentes formas de utilizar el método map. Este artículo explica el concepto del método del mapa de una manera tan fácil y profunda que cualquier programador principiante puede entenderlo y utilizarlo según sus necesidades. Por lo tanto, siga aprendiendo, trabajando y adquiriendo experiencia en javascript con linuxhint.com para comprenderlo mejor. Muchas gracias!
