Cómo usar el mapa en JavaScript

A veces, encontrar las estructuras de datos o funciones más efectivas para usar en su código puede ser muy complejo y muy rápido. Simplificar su base de código puede ahorrar mucho tiempo, mejorar la legibilidad de su código y aumentar su rendimiento general.

Una forma de simplificar su código es usar mapa() en JavaScript. El mapa es una poderosa herramienta que podemos utilizar para realizar cambios en todos los elementos. matriz de JavaScript, en lugar de realizar estos cambios con objetos de JavaScript. Con la nueva actualización de ES6 y la introducción de nuevas características y sintaxis sorprendentes como mapa()ahora tenemos un código más moderno y legible.

Discutiremos qué hace la función de mapa en JavaScript, trabajaremos con ella y analizaremos algunas de sus propiedades y métodos. Empecemos.

¿Qué función tiene el Mapa en JavaScript?

Antes de presentar mapa() función y cómo usarla, vayamos directamente a definirla.

¿Qué es un mapa en JavaScript?

Un mapa es una colección de pares clave/valor que puede usar cualquier tipo de datos como clave o valor y recordar el orden de sus entradas. Recorre en iteración todos los elementos de una matriz, lo que da como resultado una nueva matriz. En otras palabras, puede tomar una matriz, realizar cambios en los elementos y obtener una nueva matriz en función de lo que devuelve la función. Por lo tanto, el mapa es útil para encontrar y recuperar datos rápidamente.

Antes de introducir el mapa, tendrías que usar algún ítem. El problema con el uso de un objeto es que limita las claves a solo cadenas o números enteros.

Por otro lado, un mapa permite que las claves sean matrices, objetos, números, etc.

La mejora más significativa en la funcionalidad del mapa es la capacidad de iterar estructuras de datos en el orden de agregar características. Al igual que los objetos, puede agregar / eliminar claves nuevas y existentes y recuperar su valor mientras usa el mapa. Cubriremos cómo hacer esto con más detalle más adelante.

Cómo usar el mapa en JavaScript

Puede usar un mapa cuando desee realizar una acción en cada elemento de una colección y recopilar los resultados en una nueva matriz. En JavaScript, el elemento «para el bucle«O» nesting «puede hacer la misma tarea, pero podemos usar mapa() para crear funciones más legibles.

El mapa se puede crear e inicializar con nuevo mapa () sintaxis. Tiene la opción de asignarle un valor más adelante.

En este ejemplo, creamos un nuevo mapa llamado mi mapa. Después de ejecutar el código, mostrará un mapa en blanco. Mira abajo:

 let myMap = new Map()
// Output: 
// => Map(0) {}

También puedes usar nuevo mapa () para crear un nuevo objeto Map pasando una matriz. Crearemos un nuevo objeto Map que almacene algunas canciones populares como clave y el nombre del artista como valor. Vea la salida a continuación:

 let playlist = new Map([["Shake it Off", "Taylor Swift"], ["Umbrella", "Rihanna"], ["Uptown Funk", "Bruno Mars"]]);
console.log(playlist);
//Output: 
// Map {"Shake it Off" => "Taylor Swift", "Umbrella" => "Rihanna", "Uptown Funk" => "Bruno Mars"}

A continuación, analicemos formas más eficientes de agregar/eliminar elementos al método del mapa, junto con otras propiedades y métodos.

Propiedades y métodos de los mapas.

Discutiremos algunas de estas propiedades en detalle extrayéndolas de esta lista.

Adición de elementos al mapa

Para agregar nuevos pares clave/valor al mapa, use establecer () método.

 playlist.set("Firework", "Katy Perry");

Si desea agregar más de un artículo, puede combinarlos siguiendo estos pasos:

 playlist.set("Firework", "Katy Perry"); 
.set("Single Ladies", "Beyonce");

Obtener el número de elementos en el mapa

los Talla() El método devuelve el número de entradas en el mapa.

 console.log(playlist.size);
// Output:
// 5 

Descarga de elementos del mapa

Si quieres ver al artista de la canción «Umbrella», puedes usar Obtener () método.

 playlist.get("Umbrella"); 
// Output:
// Rihanna

Quitar elementos del mapa

los Eliminar() El método elimina la entrada del mapa.

 playlist.delete("Firework", "Katy Perry");

Para eliminar todas las entradas del mapa, utilice brillante() método:

 playlist.clear();

Ahora que conoce algunas propiedades y métodos, puede probarlos usted mismo.

Implementación de mapas en JavaScript

Ahora discutiremos cómo aplicar la función de mapa a su código. Primero, repasemos la sintaxis.

La sintaxis de la función de mapeo de JavaScript

La sintaxis de la función de mapa de JavaScript es la siguiente:

 let newArray = oldArray.map(function(currentValue, index, array) {
}, thisValue);

La misma sintaxis también se puede escribir usando la función de flecha de acceso directo:

 let newArray = oldArray.map((currentValue, index, array) => {
}, thisValue);

Descripción

• nuevo tablero – Esta es una nueva matriz devuelta después de aplicar la función.
• matriz antigua – Esta es la placa original en la que se ejecutará la función.
• este valor – Es un valor usado como una función este valor cuando se ejecuta.

La función de mapa tendrá tres argumentos disponibles y se llamará para cada elemento en la matriz original:

• Valor actual – Este es el valor del artículo actual.
• índice – (opcional) Este es el índice del valor actual. Podemos hacer algunos cambios basados ​​en los elementos de la matriz.
• formación – (opcional) Este es un parámetro que apunta a la matriz original.

Ejemplo de función de mapa

Ahora que conocemos la sintaxis, echemos un vistazo a una implementación de ejemplo. mapa() función:

 let artists = ["Beyonce", "Bruno Mars", "Taylor Swift"];
let bestArtist = artists.map(function(artist) {
return artist + "the best" 
});
console.log(bestArtist);
//Output: 
// ["Beyonce the best", "Bruno Mars the best", "Taylor Swift the best"];

Nota: El tablero del mapa original (artistas) no cambia.

Ejecutar mapas en JavaScript

En esta publicación, aprendiste mucho sobre la implementación de un método de mapa en JavaScript y la diferencia entre usar un mapa y un objeto. Usar un objeto es beneficioso cuando solo necesita una estructura simple para almacenar datos que son cadenas, números enteros o símbolos. Los mapas se pueden utilizar con grandes conjuntos de datos o cuando se desconocen las claves.

Gracias a este útil concepto, está un paso más cerca de crear una aplicación más moderna y legible. Considere usar un mapa en lugar de un objeto estándar en su próximo esfuerzo de codificación.