Map

Prubalo

const map1 = new Map();

map1.set("a", 1);
map1.set("b", 2);
map1.set("c", 3);

console.log(map1.get("a"));
// Expected output: 1

map1.set("a", 97);

console.log(map1.get("a"));
// Expected output: 97

console.log(map1.size);
// Expected output: 3

map1.delete("b");

console.log(map1.size);
// Expected output: 2

Descripcin

Los objetos Map son colecciones de tuplas tipo llave-valor. Una llave en Map puede aparecer solo una vez; es nica en la coleccin de Map. Un objeto Map es iterado por sus tuplas llave-valor un bucle for...of regresa un arreglo de [llave, valor] por cada iteracin. La iteracin sucede en orden de insercin, la cual corresponde al orden en el que cada tupla llave-valor fue incertada inicialmente en el map por el mtodo set() (eso es, si no haba una llave con el mismo valor en el map, cuando set() fu llamado).

La especificacin requiere que los maps sean implementados "que, en promedio, proporcione tiempos de acceso que sean sublineales al numero de elementos en la coleccin". Por lo tanto, podra ser representado internamente como una tabla hash (con una busqueda O(1)), un rbol de bsqueda (con una busqueda de O(log(N))), o cualquier otra estructura de datos, mientras la complejidad sea mejor que O(N).

Igualdad de llaves

La igualdad de valores se basa en el algoritmo Igualdad SameValueZero. (Se sola usar igualdad SameValue, el cual trataba 0 y -0 como diferentes. Revise compatibilidad con navegadores.) Lo que significa que NaN es conciderado lo mismo que NaN (a pesar de que NaN !== NaN) y todos los otros valores son conciderados iguales, de acuerdo a la semantica del operador ===.

Objects vs. Maps

Object es similar a Mapambos te permiten asignar llaves a valores, recuperar esos valores, borrar llaves, y detectar si hay algo guardado en una llave. Por esta razn (y porque no haba alternativas incorporadas), histricamente Object se ha usado como Map.

Sin embargo, hay diferencias importantes que hacen que se prefiera a Map en algunos casos:

Asignando propiedades de objeto

Asignar propiedades de objeto funciona tambin para objetos Map, y puede crear confusin.

Por lo tanto, de alguna manera esto parece funcionar:

const wrongMap = new Map();
wrongMap["bla"] = "blaa";
wrongMap["bla2"] = "blaaa2";

console.log(wrongMap); // Map { bla: 'blaa', bla2: 'blaaa2' }

Pero esta manera de asignar una propiedad, no interactua con la estructura de datos del objeto Map. Utiliza la caracterstica de el objeto genrico. El valor 'bla' no es guardado en el Map para consultas. Otras operaciones que fallan:

wrongMap.has("bla"); // false
wrongMap.delete("bla"); // false
console.log(wrongMap); // Map { bla: 'blaa', bla2: 'blaaa2' }

El uso correcto para guardar datos en el objeto Map es atravs de el mtodo set(key, value).

const contacts = new Map();
contacts.set("Jessie", {
  telefono: "213-555-1234",
  direccion: "123 N 1st Ave",
});
contacts.has("Jessie"); // true
contacts.get("Hilary"); // undefined
contacts.set("Hilary", { telefono: "617-555-4321", direccion: "321 S 2nd St" });
contacts.get("Jessie"); // {telfono: "213-555-1234", direccin: "123 N 1st Ave"}
contacts.delete("Raymond"); // false
contacts.delete("Jessie"); // true
console.log(contacts.size); // 1

APIs del navegador similares a Map

Objetos del Navegador similares a Map (o "objetos que parecen map") son interfaces de la API Web que se comportan en muchos aspectos como un objeto Map.

Al igual que el objeto Map, las entradas pueden iterarse en el mismo orden en que fueron agregadas al objeto. Los objetos similares a Map y los objetos Map tambin tienen propiedades y mtodos que comparten el mismo nombre y comportamiento. Sin embargo, contrario a los objetos Map estos slo permiten tipos especficos predefinidos para las llaves y valores de cada entrada.

Los tipos permitidos se encuentran en la especificacin de la definicin IDL (Interfaz de Descripcion del Lenguage). Por ejemplo, RTCStatsReport es un objeto similar a Map que debe usar cadenas de caracteres para sus llaves, y objetos para sus valores. Esto est definido en la especificacin IDL a continuacin:

interface RTCStatsReport {
  readonly maplike<DOMString, object>;
};

Los objetos similares a Map son o de solo-lectura o lectura-escritura (vase la palabra clave readonly en el IDL de arriba).

• Los objetos similares a Map de solo-lectura tienen la propiedad size, y los mtodos: entries(), forEach(), get(), has(), keys(), values(), y [Symbol.iterator]().
• Los objetos similares a Map de lectura-escritura tienen mtodos adicionales: clear(), delete(), y set().

Los mtodos y propiedades tienen el mismo comportamiento que las entidades equivalentes en el objeto Map, excepto por la restriccin en los tipos de llaves y valores.

Los siguientes, son ejemplos de objetos de navegador similares a Map:

• AudioParamMap
• RTCStatsReport
• EventCounts
• KeyboardLayoutMap
• MIDIInputMap
• MIDIOutputMap

Constructor

Map()

Crea un nuevo objeto Map.

Propiedades estticas

Map[Symbol.species]

La funcin constructor que es usada para crear objetos derivados.

Metodos estticos

Map.groupBy()

Agrupa los elementos de un iterable usando los valores que regresa la funcin provista. El objeto Map que regresa, usa como llaves los valores nicos de la funcin de prueba, los cuales pueden ser usados para obtener el arreglo de elementos de cada grupo.

Propiedades de instancia

Estas propiedades estn definidas en Map.prototype y las comparten todas las instancias de Map.

Map.prototype.constructor

La funcion constructor que cre el objeto de instancia. Para las instancias de Map el valor inicial es el constructor Map.

Map.prototype.size

Regresa el nmero de tuplas llave/valor en el objeto Map.

Map.prototype[Symbol.toStringTag]

El valor inicial de la propiedad [Symbol.toStringTag] es la cadena de caracteres "Map". Esta propiedad es usada en Object.prototype.toString().

Mtodos de instancia

Map.prototype.clear()

Remueve todas las tuplas llave-valor del objeto Map.

Map.prototype.delete()

Regresa true si un elemento en el objeto Map exista y ha sido removido, or false si el elemento no existe.map.has(key) regresar false despus de esto.

Map.prototype.entries()

Regresa un nuevo objeto Iterador que contiene un arreglo con dos miembros [llave, valor] por cada elemento en el objeto Map en orden de insercin.

Map.prototype.forEach()

Llama una funcin callbackFn una vez por cada tupla llave-valor presente en el objeto Map, en orden de insercin. Si un parametro thisArg es proporcionado a forEach, ser utilizado como el valor this para cada llamada a la funcion callback.

Map.prototype.get()

Regresa el valor asociado a la llave que se pasa como argumento, o undefined si no hay ninguno.

Map.prototype.has()

Regresa un booleano indicando si, en el objeto Map un valor ha sido asociado a la llave pasada como argumento.

Map.prototype.keys()

Regresa un nuevo objeto Iterador que contiene las llaves para cada elemento en el objeto Map, en orden de insercin.

Map.prototype.set()

Asigna el valor en el objeto Map para la llave pasada como argumento. Regresa el objeto Map.

Map.prototype.values()

Regresa un nuevo objeto Iterador que contiene los valores para cada elemento en un objeto Map, en orden de insercin.

Map.prototype[Symbol.iterator]()

Regresa un nuevo objeto Iterador que contiene un arreglo con dos miembros [llave, valor] por cada elemento en el objeto Map, en orden de insercin.

Ejemplos

Usando el objeto Map

const myMap = new Map();

const keyString = "a string";
const keyObj = {};
const keyFunc = function () {};

// asignando valores
myMap.set(keyString, "valor asociado con la llave 'a string'");
myMap.set(keyObj, "valor asociado con la llave keyObj");
myMap.set(keyFunc, "valor asociado con la llave keyFunc");

console.log(myMap.size); // 3

// obteniendo los valores
console.log(myMap.get(keyString)); // "valor asociado con la llave 'a string'"
console.log(myMap.get(keyObj)); // "valor asociado con la llave keyObj"
console.log(myMap.get(keyFunc)); // "valor asociado con la llave keyFunc"

console.log(myMap.get("a string")); // "valor asociado con la llave 'a string'", porque keyString === 'a string'
console.log(myMap.get({})); // undefined, porque keyObj !== {}
console.log(myMap.get(function () {})); // undefined, porque keyFunc !== function () {}

Usando NaN como llave de Map

NaN puede tambin usarse como una llave. A pesar que cada NaN no es igual a si mismo (NaN !== NaN es verdadero), el siguiente ejemplo funciona porque los NaN son indistinguibles entre s:

const myMap = new Map();
myMap.set(NaN, "not a number");

myMap.get(NaN);
// "not a number"

const otherNaN = Number("foo");
myMap.get(otherNaN);
// "not a number"

Iterando Map con for...of

Los Maps pueden iterarse usando un bucle for...of:

const myMap = new Map();
myMap.set(0, "zero");
myMap.set(1, "one");

for (const [key, value] of myMap) {
  console.log(`${key} = ${value}`);
}
// 0 = zero
// 1 = one

for (const key of myMap.keys()) {
  console.log(key);
}
// 0
// 1

for (const value of myMap.values()) {
  console.log(value);
}
// zero
// one

for (const [key, value] of myMap.entries()) {
  console.log(`${key} = ${value}`);
}
// 0 = zero
// 1 = one

Iterando Map con forEach()

Los Maps pueden iterarse usando el mtodo forEach():

myMap.forEach((value, key) => {
  console.log(`${key} = ${value}`);
});
// 0 = zero
// 1 = one

Relacin con objetos Array

const kvArray = [
  ["key1", "value1"],
  ["key2", "value2"],
];

// Usa el constructor ordinario Map para transformar un Array 2D llave-valor a un map
const myMap = new Map(kvArray);

console.log(myMap.get("key1")); // "value1"

// Usa Array.from() para transformar un map a un Array 2D llave-valor
console.log(Array.from(myMap)); // Mostrar exactamente el mismo Array como kvArray

// Una forma concisa de hacer lo mismo, usando la sintaxis spread
console.log([...myMap]);

// O usa los iteradores keys() o values(), y conviertelos a un arreglo
console.log(Array.from(myMap.keys())); // ["key1", "key2"]

Clonando y uniendo Maps

As como los Array, los Map pueden clonarse:

const original = new Map([[1, "one"]]);

const clone = new Map(original);

console.log(clone.get(1)); // one
console.log(original === clone); // false (til para comparaciones superficiales)

Los objetos Map pueden unirse, manteniendo la unicidad de las llaves:

const first = new Map([
  [1, "one"],
  [2, "two"],
  [3, "three"],
]);

const second = new Map([
  [1, "uno"],
  [2, "dos"],
]);

// Al unir ambos maps. La ultima llave repetida gana.
// la sintaxis Spread convierte un Map a un Array
const merged = new Map([...first, ...second]);

console.log(merged.get(1)); // uno
console.log(merged.get(2)); // dos
console.log(merged.get(3)); // three

Los Maps tambin pueden unirse a Arrays:

const first = new Map([
  [1, "one"],
  [2, "two"],
  [3, "three"],
]);

const second = new Map([
  [1, "uno"],
  [2, "dos"],
]);

// Merge maps with an array. The last repeated key wins.
const merged = new Map([...first, ...second, [1, "eins"]]);

console.log(merged.get(1)); // eins
console.log(merged.get(2)); // dos
console.log(merged.get(3)); // three

Especificaciones

Compatibilidad con navegadores

Vase tambin

• Polyfill para Map en core-js
• Set
• WeakMap
• WeakSet