Mapas JavaScript
Un mapa contiene pares clave-valor donde las claves pueden ser cualquier tipo de datos.
Un mapa recuerda el orden de inserción original de las claves.
Un mapa tiene una propiedad que representa el tamaño del mapa.
Métodos de mapa
| Método | Descripción |
|---|---|
| nuevo mapa() | Crea un nuevo objeto de mapa |
| colocar() | Establece el valor de una clave en un mapa |
| obtener() | Obtiene el valor de una clave en un mapa |
| claro() | Elimina todos los elementos de un Mapa |
| Eliminar() | Elimina un elemento de mapa especificado por una clave |
| posee() | Devuelve verdadero si existe una clave en un mapa |
| para cada() | Invoca una devolución de llamada para cada par clave/valor en un mapa |
| entradas() | Devuelve un objeto iterador con los pares [clave, valor] en un mapa |
| teclas() | Devuelve un objeto iterador con las claves en un Mapa |
| valores() | Devuelve un objeto iterador de los valores en un Mapa |
| Propiedad | Descripción |
|---|---|
| Talla | Devuelve el número de elementos del mapa |
Cómo crear un mapa
Puede crear un mapa de JavaScript mediante:
- Pasar una matriz a
new Map() - Crea un mapa y usa
Map.set()
nuevo mapa()
Puede crear un Mapa pasando un Array al new Map()constructor:
Ejemplo
// Create a Map
const fruits = new Map([
["apples", 500],
["bananas", 300],
["oranges", 200]
]);
Mapa.set()
Puede agregar elementos a un Mapa con el set()método:
Ejemplo
// Create a Map
const fruits = new Map();
// Set Map Values
fruits.set("apples", 500);
fruits.set("bananas", 300);
fruits.set("oranges", 200);
El set()método también se puede utilizar para cambiar los valores de mapa existentes:
Ejemplo
fruits.set("apples", 500);
Mapa.get()
El get()método obtiene el valor de una clave en un Mapa:
Ejemplo
fruits.get("apples"); // Returns 500
Tamaño de mapa
La sizepropiedad devuelve el número de elementos en un Mapa:
Ejemplo
fruits.size;
Mapa.eliminar()
El delete()método elimina un elemento Map:
Ejemplo
fruits.delete("apples");
Mapa.clear()
El clear()método elimina todos los elementos de un Mapa:
Ejemplo
fruits.clear();
Mapa.has()
El has()método devuelve verdadero si existe una clave en un mapa:
Ejemplo
fruits.has("apples");
Prueba esto:
fruits.delete("apples");
fruits.has("apples");
Los mapas son objetos
typeof devuelve el objeto:
Ejemplo
// Returns object:
typeof fruits;
instanceof El mapa devuelve verdadero:
Ejemplo
// Returns true:
fruits instanceof Map;
Objetos JavaScript vs Mapas
Diferencias entre Objetos JavaScript y Mapas:
| Objeto | Mapa | |
|---|---|---|
| Iterable | No iterable directamente | directamente iterable |
| Tamaño | No tiene una propiedad de tamaño | Tener una propiedad de tamaño |
| Tipos de clave | Las claves deben ser cadenas (o símbolos) | Las claves pueden ser de cualquier tipo de datos. |
| orden clave | Las llaves no están bien ordenadas. | Las llaves se ordenan por inserción |
| valores predeterminados | Tener claves predeterminadas | No tiene claves predeterminadas |
Mapa.paraCada()
El forEach()método invoca una devolución de llamada para cada par clave/valor en un mapa:
Ejemplo
// List all entries
let text = "";
fruits.forEach (function(value, key) {
text += key + ' = ' + value;
})
Mapa.keys()
El keys()método devuelve un objeto iterador con las claves en un Mapa:
Ejemplo
// List all keys
let veggies = "";
for (const x of fruits.keys()) {
veggies += x;
}
Mapa.valores()
El valuesmétodo devuelve un objeto iterador con los valores en un Mapa:
Ejemplo
// Sum all values
let total = 0;
for (const x of fruits.values()) {
total += x;
}
Mapa.entradas()
El entries()método devuelve un objeto iterador con [clave, valores] en un Mapa:
Ejemplo
// List all entries
let text = "";
for (const x of fruits.entries()) {
text += x;
}
Objetos como claves
Poder usar objetos como llaves es una característica importante del Mapa.
Ejemplo
// Create Objects
const apples = {name: 'Apples'};
const bananas = {name: 'Bananas'};
const oranges = {name: 'Oranges'};
// Create a Map
const fruits = new Map();
// Add new Elements to the Map
fruits.set(apples, 500);
fruits.set(bananas, 300);
fruits.set(oranges, 200);
Recuerde: la clave es un objeto (manzanas), no una cadena ("manzanas"):
Ejemplo
fruits.get("apples"); // Returns undefined
Compatibilidad con navegador
Los mapas de JavaScript son compatibles con todos los navegadores, excepto Internet Explorer:
| Chrome | Edge | Firefox | Safari | Opera |