HashMap JavaScript: Qué es, Cómo Usarlo y Ejemplos

Si estás preparándote para entrevistas técnicas o simplemente quieres subir al siguiente nivel como desarrollador, entender cómo funciona un HashMap en JavaScript puede marcar una gran diferencia en tu forma de resolver problemas y destacar frente a otros candidatos o apoyar a tu equipo.

En esta guía encontrarás todo lo que necesitas: explicaciones claras, ejemplos prácticos y comparaciones directas con objetos para que sepas cuándo usar cada uno y tomes mejores decisiones.

¿Qué es un HashMap en JavaScript?

Un HashMap es una estructura de datos que almacena pares clave-valor. En JavaScript, es posible que estés familiarizado con los objetos literales como:

const user = {
  name: 'john',
  age: 30,
}

user.name // 'john'

Pues bien, podríamos crear un diccionario o un mapa de claves y valores utilizando un objeto literal, como:

const numbersToEnglishDict = {
  1: 'one',
  2: 'two',
  3: 'three',
  4: 'four',
  5: 'five',
}

En este caso, el número es la clave y la palabra en inglés es el valor. Así, al acceder a numbersToEnglishDict[1], obtendremos 'one'.

numbersToEnglishDict[1] // 'one'

// de manera dinámica:
const number = 2
console.log(numbersToEnglishDict[number]) // 'two'

También es conocido como diccionario o tabla hash, dependiendo del lenguaje de programación.

En JavaScript podemos crear un HashMap de dos maneras:

• Utilizando un objeto literal como en el ejemplo anterior
• Con la clase Map.

Antes de entrar más en detalles, primero debes estar seguro de que un hashmap es lo que realmente necesitas.

A continuación, te explico cuándo usarlo y cuándo no.

Cuándo usar un HashMap en JavaScript

Un HashMap (o Map en JavaScript) es especialmente efectivo en situaciones donde necesitas obtener información rápidamente usando una clave en una colección de datos (como un array), sin importar el orden o la posición del dato.

Normalmente nos ayuda a resolver problemas con más eficiencia y claridad. Aquí hay algunos ejemplos:

En entrevistas técnicas

Usa un HashMap cuando el problema requiere:

• Contar frecuencias rápidamente
  Ej: cuántas veces aparece cada letra en un string.

• Buscar duplicados o no duplicados en arrays o strings
  Ej: primer carácter no repetido, encontrar el duplicado.

• Resolver búsquedas en tiempo constante
  Ej: twoSum, containsDuplicate, groupAnagrams.

• Comparar elementos por valor, sin importar orden
  Ej: verificar si dos palabras son anagramas.

• Optimizar soluciones que serían O(n²)
  Ej: pasar de una solución anidada a una lineal usando un diccionario temporal.

• Usar memoización para evitar cálculos repetidos
  Ej: problemas de programación dinámica o recursión optimizada.

• Simular estructuras de datos personalizadas
  Ej: LRU Cache, contador de visitas, indexadores por clave.

En estos casos, el HashMap no solo hace la solución más eficiente, también más clara y mantenible.

🧑‍💻 En proyectos reales

Usa un HashMap cuando necesites:

• Acceder a datos por clave en vez de por posición
  Ej: buscar el carrito de un usuario por su ID.

• Asociar datos adicionales a objetos sin mutarlos
  Ej: almacenar metadatos de nodos DOM.

• Evitar colisiones de claves o herencia no deseada
  Ej: usar claves como objetos o evitar interferencias con prototipos.

• Guardar configuraciones o preferencias por módulo o usuario
  Ej: settings dinámicos, flags personalizados.

• Mapear relaciones complejas de forma eficiente
  Ej: dependencias entre módulos, grafos, relaciones uno-a-muchos.

• Construir caches o stores en memoria
  Ej: sistemas de caché, datos temporales, sesiones.

• Contar o agrupar elementos por categoría
  Ej: agrupar logs por tipo, contar visitas por país.

Como puedes ver, las estructuras de datos como HashMap sirven más allá de resolver problemas en entrevistas. También son útiles para construir aplicaciones eficientes y escalables.

Si quieres saber cómo crear un HashMap en JavaScript efectivmente, a continuación te muestro cómo hacerlo.

Cómo crear un HashMap en JavaScript

Tradicionalmente, los objetos literales se han utilizado como HashMaps en JavaScript. Sin embargo, desde ECMAScript 2015 (ES6) se introdujo la clase Map, que ofrece una forma más eficiente y flexible de trabajar con pares clave-valor.

Anteriormente, te mostré cómo crear un HashMap utilizando un objeto literal:

const numbersToEnglishDict = {
  1: 'one',
  2: 'two',
  3: 'three',
  4: 'four',
  5: 'five',
}

Ahora, veamos cómo crear un HashMap utilizando la clase Map:

const numbersToEnglishDict = new Map()

numbersToEnglishDict.set(1, 'one')
numbersToEnglishDict.set(2, 'two')
numbersToEnglishDict.set(3, 'three')
numbersToEnglishDict.set(4, 'four')
numbersToEnglishDict.set(5, 'five')

En este ejemplo, estamos creando un nuevo Map vacío y luego agregando pares clave-valor utilizando el método set.

Pero también podemos inicializar un Map con un array de pares clave-valor:

const englishNumbers = [
  [1, 'one'],
  [2, 'two'],
  [3, 'three'],
  [4, 'four'],
  [5, 'five'],
]

const numbersToEnglishDict = new Map(englishNumbers)
numbersToEnglishDict.get(1) // 'one'

En este caso, estamos pasando un array de arrays, donde cada sub-array contiene un par clave-valor en el índice 0 y 1 respectivamente.

Puedes crear un HashMap utilizando un objeto literal o la clase Map, pero: ¿Existe una diferencia entre ambas?

Esto es pregunta de entrevista, así que asegúrate de entenderlo bien.

A continuación encuentras la respuesta.

HashMap vs Object en JavaScript: ¿Son lo mismo?

La respuesta corta es: no son lo mismo.

La respuesta larga es:

Conceptualmente, un HashMap es una estructura basada en pares clave-valor. Por lo que un objeto literal y un Map se pueden usar para crear un HashMap.

Considera que:

• Un objeto literal en JavaScrip es una estructura genérica para almacenar datos en pares clave-valor.
• Un Map es una implementación específica de un HashMap que ofrece características adicionales y un rendimiento optimizado.

La diferencia está en las características y el rendimiento de cada uno.

Ahora, tal vez te estés preguntando: ¿Cuándo usar un HashMap en JavaScript?

Te lo explico a continuación.

Map vs Object: ¿Cuándo usar cada uno?

Tal vez te estés preguntando: ¿Por qué usar un Map si puedo usar un objeto literal?

Tanto Map como los objetos {} permiten almacenar pares clave-valor en JavaScript, pero elegir el correcto puede ahorrarte bugs, líneas de código innecesarias y mejorar el rendimiento en ciertos casos.

Usa Map cuando:

• Las claves no son strings, como objetos, funciones o arrays.

  const user = { id: 1 }
  const map = new Map()
  map.set(user, 'datos del usuario')
  

• Te importa el orden en que se insertan los elementos (porque Map lo respeta).

  const map = new Map()
  map.set('a', 1)
  map.set('b', 2)
  // Siempre se recorrerá en ese orden
  

• Vas a realizar muchas inserciones, eliminaciones o búsquedas.

  Map fue optimizado para eso, y su rendimiento es más predecible en esos casos.

• Quieres una API más limpia y expresiva con métodos como .get(), .set(), .has(), .delete() y .size.

Usa objetos {} cuando:

• Tus claves son strings simples o tienes una estructura muy estática.

  const user = {
    name: 'Ana',
    age: 30,
  }
  

• Necesitas compatibilidad con JSON o estás trabajando con APIs que requieren objetos planos.

• No necesitas métodos adicionales y prefieres mantener una estructura sencilla.

¿Y en entrevistas técnicas?

En entrevistas, la mayoría de problemas que requieren una estructura clave-valor se resuelven perfectamente con un objeto {}, porque es más rápido de escribir y suficiente para el caso.

Pero si te enfrentas a un problema donde:

• Las claves deben ser algo más que strings
• El orden importa
• Se espera una solución más robusta
• El entrevistador te pregunta las debilidades de un objeto literal

Entonces Map puede ser una mejor opción — y usarlo demuestra que conoces las herramientas modernas del lenguaje.

Te recomiendo que siempre seas muy explicito con el entrevistador explicando que puedes usar un Map u objeto literal, menciones los pros y contras, sugieras cuál usar y expliques por qué. También es bueno que le preguntes si tiene alguna preferencia.

Como referencia, también puedes consultar la pregunta en StackOverflow: Diferencias y ventajas: Set y Map contra Array y Object.

Aprende Algoritmos y Estructuras de Datos

Este artículo es parte de un esfuerzo continuo por compartir contenido claro y práctico sobre algoritmos, estructuras de datos y preparación técnica.

Si quieres recibir este tipo de recursos directamente en tu correo, puedes unirte a mi newsletter. Sin spam. Solo contenido útil para desarrolladores que quieren crecer.

👉 Unirme a la newsletter

Al unirte vas a recibir un regalo sorpresa. Si quieres descubrirlo, dale click al link de arriba.

HashMap vs Array: ¿Cuándo usar cada uno?

Tanto Map como los arrays son estructuras fundamentales en JavaScript, pero sirven para resolver problemas distintos.

Usar uno cuando necesitas el otro puede hacer tu código más lento, más complejo o simplemente incorrecto.

Debes usar un HashMap (Map) cuando:

• Necesitas acceder rápidamente a un valor a partir de una clave.
• La relación es tipo clave → valor (como un diccionario o un índice).
• El orden de inserción importa pero no es secuencial.
• Las búsquedas deben ser inmediatas sin recorrer toda la estructura.

const products = new Map()
products.set('camisa', { price: 25 })
products.set('pantalón', { price: 40 })

Debes usar un Array cuando:

• El orden y la posición de los elementos es importante.
• Vas a trabajar con listas secuenciales, como tareas o resultados.
• Necesitas métodos como .map(), .filter(), .reduce(), etc.
• El acceso se hace por índice (no por clave).

const products = [
  { type: 'camisa', price: 25 },
  { type: 'pantalón', price: 40 },
]

Como resumen:

• Usa Map si necesitas búsquedas rápidas por clave.
• Usa Array si el orden y la secuencia son lo más importante en tu lógica.

HashMap y Big O Notation

La notación Big O es una forma de describir el rendimiento de un algoritmo en términos de tiempo y espacio.

Uno de los motivos por los que los HashMaps son tan populares es porque ofrecen tiempos de acceso, inserción y eliminación muy eficientes: en promedio, O(1).

Nota: Aunque el tiempo promedio es constante, en el peor de los casos (por colisiones internas o mal hashing), algunas operaciones podrían degradarse a O(n). Sin embargo, esto es poco común en implementaciones modernas.

Si lo anterior no te suena, no te preocupes. Si es la primera vez que escuchas términos como Big O notation, dale click al artículo de Big O notation donde lo explico desde cero para quienes van comenzando o quieren reforzar sus conocimientos.

¿Por qué es importante entender Big O notation?

Porque te permite tomar decisiones técnicas informadas. Saber que puedes acceder a miles de elementos en tiempo constante marca la diferencia cuando optimizas el rendimiento de una app real o necesitas justificar tus decisiones en una entrevista.

Si estás aprendiendo DSA para entrevistas, dominar estas complejidades no es opcional: es lo que te da ventaja frente a otros candidatos.

Objetos literales y Map en TypeScript

Si estás usando TypeScript, puedes aprovechar el tipado estático para definir claramente las claves y valores de tu HashMap. Esto es especialmente útil si estás trabajando en un proyecto grande o colaborando con otros desarrolladores.

TypeScript te permite definir tipos para las claves y valores de un Map, lo que mejora la legibilidad y la seguridad del código.

Usando Map con tipos explícitos

const userMap: Map<string, { name: string; age: number }> = new Map()

userMap.set('user1', { name: 'Alice', age: 28 })
userMap.set('user2', { name: 'Bob', age: 35 })

const alice = userMap.get('user1')

Aquí estamos indicando que el Map usará claves string y como valores usará objetos con name y age.

Usando objetos literales tipados

También puedes usar un objeto como HashMap, pero deberás definir el tipo manualmente:

type User = { name: string; age: number }

const userDict: Record<string, User> = {
  user1: { name: 'Alice', age: 28 },
  user2: { name: 'Bob', age: 35 },
}

const bob = userDict['user2']

El tipo Record<string, User> indica que tendrás un objeto cuyas claves son string y sus valores son del tipo User.

Una vez que definas el tipo, TypeScript te ayudará a evitar errores comunes, como asignar un valor incorrecto.

Cómo convertir un Array a un HashMap en JavaScript

Si tienes un array con pares clave-valor o una lista de objetos, convertirlo a un Map es una forma eficiente de optimizar búsquedas o accesos directos por clave.

Esto es especialmente útil cuando trabajas con datos provenientes de una API o cuando necesitas transformar listas planas en estructuras más eficientes.

Ejemplo 1: array de pares clave-valor

const entries = [
  ['name', 'Alice'],
  ['age', 28],
]
const map = new Map(entries)

Ejemplo 2: array de objetos

const users = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
]

const userMap = new Map(users.map((user) => [user.id, user]))

Cómo convertir un HashMap a un Array en JavaScript

Un Map puede convertirse fácilmente a un array usando el spread operator o los métodos .entries(), .keys() y .values(). Esto es útil si quieres aplicar métodos funcionales como .map() o .filter() o exportar los datos.

const map = new Map([
  ['name', 'Alice'],
  ['age', 28],
])
const array = [...map] // [['name', 'Alice'], ['age', 28]]

const keys = [...map.keys()]
const values = [...map.values()]
const entries = [...map.entries()]

Cómo saber el tamaño de un HashMap en JavaScript

Con los objetos {} tendrías que contar las claves manualmente con Object.keys().length, pero Map te ofrece una forma más limpia y directa:

const map = new Map()
map.set('a', 1)
map.set('b', 2)

console.log(map.size) // 2

Cómo obtener el valor de un HashMap por clave

Puedes obtener un valor con .get(key) y verificar si existe con .has(key):

const map = new Map()
map.set('username', 'developer')

console.log(map.get('username')) // 'developer'
console.log(map.has('password')) // false

Este patrón es útil para evitar errores en estructuras dinámicas o cuando trabajas con datos opcionales.

Cómo iterar un HashMap en JavaScript

Recorrer un Map es muy sencillo con for...of o .forEach():

const map = new Map([
  ['name', 'Alice'],
  ['age', 28],
])

for (const [key, value] of map) {
  console.log(`${key}: ${value}`)
}

Solo las claves:

for (const key of map.keys()) {
  console.log(key)
}

Solo los valores:

for (const value of map.values()) {
  console.log(value)
}

Con .forEach():

map.forEach((value, key) => {
  console.log(`${key} => ${value}`)
})

Otros métodos útiles de un HashMap

Además de los métodos .get() y .set(), Map tiene utilidades que te permiten manejar colecciones clave-valor con más control:

Estos métodos son ideales cuando necesitas manipular datos dinámicamente, iterar o limpiar el contenido de forma controlada.

Preguntas frecuentes sobre HashMap

¿HashMap y Map son lo mismo en JavaScript?
Técnicamente no, pero en la práctica sí. HashMap es el nombre de la estructura de datos, mientras que Map es su implementación moderna en JavaScript. Se usan como sinónimos porque cumplen el mismo propósito.

¿Puedo usar objetos como claves en un Map?
Sí, y de hecho es una de sus principales ventajas frente a los objetos {}. Puedes usar objetos, arrays, funciones o cualquier tipo como clave.

¿Es Map más rápido que un objeto?
Depende del caso. Para inserciones, borrados y búsquedas frecuentes, Map suele ser más eficiente y más predecible. También te da una API más clara.

¿Debo usar Map en entrevistas técnicas?
Sí, especialmente si el problema involucra claves complejas, orden de inserción o necesitas un rendimiento más controlado. Además, demuestra que dominas estructuras modernas del lenguaje.

Más Recursos Para Pasar Entrevistas y Aprender

Recursos de Developero:

• Si no estás recibiendo llamadas de entrevistas, revisa el artículo Cómo hacer un curriculum de programador para que te CONTRATEN
• Si no estás pasando entrevistas técnicas, revisa el artículo Code Interview Preparation: Cómo Responder una Entrevista Técnica Exitosamente
• Si te cuesta trabajo entender Big O notation, revisa el artículo Ejemplos de notación Big O en JavaScript
• Ahora si también quieres prepararte para entrevistas de diseño de sistemas, entonces revisa el artículo Mega guía completa de aprendizaje y preparación para entrevistas de diseño de sistemas

Con estos contenidos, estás más cerca de convertirte en ese perfil técnico que todas las empresas quieren.

Otros recursos:

• Repositorio de Github Data Structures and Algorithms
• Repositorio de Github Coding Interview University

Sobre el autor

Soy Juan Correa, un desarrollador con experiencia construyendo productos reales y enseñando a otros profesionales.

En cada artículo busco simplificar lo complejo y ayudarte a avanzar de forma práctica, tanto si estás aprendiendo como si te estás preparando para tu próxima entrevista.

Conecta conmigo en LinkedIn si buscas un consejo, quieres seguir aprendiendo sobre desarrollo web, entrevistas técnicas y más.