Hoy hablaremos de Map y Set dos estructuras de datos , introducidas por es2015 , veamos de lo que trata
Definición :
bueno Map es no es mas que un almacén clave /valor al igual que un objeto pero a diferencia del objeto map puede recibir cualquier valor como clave
y los objetos no , inténtemelo
const myObject = {};
myObject['one'] = 1;
myObject[{ name: 'Tomas', age: 15 }] = 15;
declaramos un objeto y voy a guarda con la propiedad one un 1
y el segundo voy a poner un objeto como clave y su valor va ha ser 15
{ one: 1, '[object Object]': 15 }
bien lo segundo que almacenamos no devuelve un ‘[object object]’ eso pasa por que los objetos convierten sus claves a cadenas y al convertir un objeto a cadena obtenemos lo siguiente
console.log(String({ name: 'hel', dos: 'asas' }));
//[object Object]
otra caracteristica de map esque solo puede haber un clave dentro de la estructura al igual que un objeto, de hecho antes los objetos eran usados como map si por ejemplo yo hago lo siguiente
const map = new Map();
map.set('uno', 2);
map.set({ name: 2 }, 2);
map.set({ name: 2 }, 3);
console.log(map);
Map solo considerara el ultimo valor agregado ahora veamos los métodos de Map, bien arriba ya hemos visto uno, que es set() con esto podemos agregar valores a Map pero también remplazar por cierto set devuelve una instancia de Map entonces esto quiere decir que yo puedo reducir a esto.
const map = new Map();
map.set('uno', 2).set({ name: 2 }, 2).set({ name: 2 }, 3);
Genial , el siguiente método es get, nada fuera de lo común , das la clave y te da el valor
console.log(map.get('uno'));
el siguiente método es has
sirve para preguntar si existe algún valor con esa llave
map.has('uno')
ahora size
que no es mas que el total de elementos dentro de Map
map.size
si queremos obtener los valores solamente ,Map tiene un método que se llama values
este nos devuelve un iterable al igual que un array o un objeto estos podemos recorrerlo con el bucle forof
que se lleva muy bien con los iterables
for (const iterator of map.values()) {
console.log(iterator);
}
bien ahora que ya obtenemos los valores , obtengamos las claves, de igual manera obtenemos esto llamando al metodo map.keys()
for (const iterator of map.keys()) {
console.log(iterator);
}
también existe el método map.entries()
que lo que hace es devolverte el clave valor dentro de un arreglo
for (const iterator of map.entries()) {
console.log(iterator);
}
bien ahora un pequeño problemita , imagina que un trabajador de un museo que tiene unas pequeñas tarjetitas con una serie, esta se le tiene que dar a cada persona que entra al museo se supone que cuando una persona sale, deja la tarjetita y se la dan a otro , bien el trabajador desea saber a cada momento quien tiene cada tarjeta
const persons = [
{ name: 'luis', age: 10 },
{ name: 'Pedro', age: 12 },
{ name: 'Juan', age: 15 },
{ name: 'David', age: 18 },
];const cards = ['181k', '183k', '182k'];
los datos son los siguientes ,ahora procedamos a atender 🙂
const infoCards = new Map();
infoCards.set(cards[0], persons[0]);
infoCards.set(cards[1], persons[1]);
infoCards.set(cards[2], persons[2]);console.log(infoCards);
a la persona 1 le damos la tarjeta 1, a la persona 2 la tarjeta 2 , a la persona la tarjeta 3 le damos la tarjeta 3 bueno y ahora ya no tengo mas tarjetas pero me queda un persona. bueno el tiene que esperar que salga alguien con alguna tarjeta
supongamos que sale la persona 1, ahora tendría que borrar el registro de que la persona 1 ya no tiene la tarjeta 1 pero bueno eso lo hace map ahora sencillamente hago lo siguiente:
infoCards.set(cards[0], persons[3]);
listo asi sucesivamente sin hacer ninguna otra operación, y si quiero saber quien tiene tal tarjeta solo le doy a map la tarjeta y me dice quien la tiene
console.log(infoCards.get(cards[0]));
// { name: 'David', age: 18 },
y quiero saber si esta ocupada hago lo siguiente
console.log(infoCards.has(cards[0]));
// true
y si deseas recorrer Map directamente ,este te proporciona el método foreach
que al pasarle un callback este te entrega , el valor , la clave y el map mismo
infoCards.forEach((value, key, arr) => {
console.log('la tarjeta' + key);
console.log('esta ocupada por:' + value.name);
});
bien esto es todo por ahora, queda pendiente set
🙂