JavaScript Maps

JavaScript Maps

Contenido original de W3Schools


Un mapa contiene pares clave-valor donde las claves pueden ser de cualquier tipo de datos. Un mapa recuerda el orden de inserción original de las claves.


Métodos esenciales Maps

MétodoDescripción
new Map()Crea un nuevo Map.
set()Establece el valor de una clave en un Map.
get()Obtiene el valor de una clave en un Map.
delete()Elimina un elemento Map especificado por la clave.
has()Devuelve verdadero si existe una clave en un Map.
forEach()Llama a una función para cada par clave/valor en un Map.
entries()Devuelve un iterador con los pares [clave, valor] en un Map.
PropiedadDescripción
sizeDevuelve el número de elementos de un Map.

¿Cómo crear un Map?

Puedes crear un mapa de JavaScript mediante:

  • Pasando una matriz a new Map()

  • Crea un mapa y utiliza Map.set()


El método new Map()

Puedes crear un mapa pasando un Array al constructor new Map():

Ejemplo:

// Crea un Mapa
const fruits = new Map([
  ["apples", 500],
  ["bananas", 300],
  ["oranges", 200]
]);

Ver ejemplo


El método set()

Puedes agregar elementos a un mapa con el método set():

Ejemplo:

// Crea un Mapa
const fruits = new Map();

// Establece valores Map
fruits.set("apples", 500);
fruits.set("bananas", 300);
fruits.set("oranges", 200);

Ver ejemplo

El método set() también se puede utilizar para cambiar los valores del mapa existentes:

Ejemplo:

fruits.set("apples", 200);

Ver ejemplo


El método get()

El método get() obtiene el valor de una clave en un mapa:

Ejemplo:

fruits.get("apples");    // Devuelve 500

Ver ejemplo


La propiedad size

La propiedad size devuelve la cantidad de elementos en un mapa:

Ejemplo:

fruits.size;

Ver ejemplo


El método delete()

El método delete() elimina un elemento del mapa:

Ejemplo:

fruits.delete("apples");

Ver ejemplo


El método has()

El método has() devuelve verdadero si existe una clave en un mapa:

Ejemplo:

fruits.has("apples");

Ver ejemplo

Prueba esto:

fruits.delete("apples");
fruits.has("apples");

Ver ejemplo


Objetos vs mapas

Diferencias entre objetos JavaScript y mapas:

ObjetoMapa
IterableNo iterable directamente.Directamente iterable.
SizeNo tener una propiedad size.Tener una propiedad size.
Key TypesLas claves deben ser cadenas (o símbolos).Las claves pueden ser de cualquier tipo de datos.
Key OrderLas llaves no están bien ordenadas.Las claves se ordenan por inserción.
DefaultsTener claves predeterminadas.No tener claves predeterminadas.

El método forEach()

El método forEach() llama a una función para cada par clave/valor en un mapa:

Ejemplo:

// Lista todas las entradas
let text = "";
fruits.forEach (function(value, key) {
  text += key + ' = ' + value;
})

Ver ejemplo


El método entries()

El método entries() devuelve un objeto iterador con la [clave, valores] en un mapa:

Ejemplo:

// Lista todas las entradas
let text = "";
for (const x of fruits.entries()) {
  text += x;
}

Ver ejemplo


Soporte del navegador

Los mapas JavaScript son compatibles con todos los navegadores, excepto Internet Explorer:

ChromeEdgeFirefoxSafariOpera

W3Schools es el sitio de desarrolladores web más grande del mundo.

Did you find this article valuable?

Support Santos Romero by becoming a sponsor. Any amount is appreciated!