Diccionarios vs arrays: cuándo usar cada uno

La optimización en JavaScript empieza por elegir bien la estructura de datos. Si haces muchas búsquedas y actualizaciones por ID, cambiar de un array a un diccionario u Map puede darte respuestas prácticamente instantáneas y un código más claro.

¿Por qué un array complica la búsqueda por ID?

Buscar un elemento específico en un array con find o findIndex obliga a recorrer elementos uno a uno. Con pocos datos no se nota, pero con miles, el coste crece porque hay que comparar hasta “dar con el ID” correcto, descartando el resto.

• En un array, la búsqueda va elemento a elemento hasta encontrar coincidencia.
• Modificar requiere antes ubicar la posición con findIndex.
• Con muchos datos, estas operaciones se vuelven costosas.

Ejemplo de actualización en array:

const customers = [
  { id: 1, name: 'Ana' },
  { id: 3, name: 'Jim' },
];

const index = customers.findIndex(c => c.id === 3);
if (index !== -1) {
  customers[index] = { ...customers[index], name: 'Nicolás' };
}

¿Cómo un diccionario o Map acelera las operaciones?

La clave está en indexar por ID. Con un objeto tipo diccionario, la llave es el ID y el valor es el objeto. Así, acceder es directo: conoces el ID y obtienes el elemento sin recorridos. Con Map, la idea es la misma, pero con métodos nativos que facilitan el trabajo.

• Acceso directo: con la llave (ID) obtienes el valor de inmediato.
• Actualizar y agregar con set es simple y seguro.
• Búsquedas y modificaciones por ID son más veloces que un find.

Diccionario con objeto:

const customersById = {
  3: { id: 3, name: 'Jim' },
};

const customer = customersById[3]; // Acceso instantáneo.
customersById[3] = { ...customer, name: 'Nicolás' }; // Actualización directa.

Uso de Map con métodos nativos:

const customers = new Map([
  [3, { id: 3, name: 'Jim' }],
]);

// Obtener por ID.
const c = customers.get(3);

// Actualizar por ID.
customers.set(3, { ...c, name: 'Nicolás' });

// Agregar o actualizar (si no existe, lo crea; si existe, lo modifica).
customers.set(4, { id: 4, name: 'Ana' });

Atención: no todo son ventajas. No es un array. No puedes usar map, filter, reduce o forEach directamente. Si quieres iterar, convierte antes a array.

Conversión para iterar:

const arr = Array.from(customers.values());
const filtered = arr.filter(c => c.name.startsWith('N'));

¿Cuándo elegir array y cuándo Map en JavaScript?

Elegir depende del caso de uso. Pregunta qué hace más tu aplicación: ¿buscar y actualizar por ID o iterar, filtrar y transformar colecciones?

• Usa Map cuando:

  • Haces muchas búsquedas por ID.
  • Realizas muchas actualizaciones por ID.
  • Necesitas agregar y modificar con una sola operación usando set.

• Mantén array cuando:

  • Iteras con frecuencia con map, filter o reduce.
  • Requieres operaciones que dependen del recorrido secuencial.
  • Quieres agregar con push al final de la lista.

• Considera limitaciones de Map:

  • No soporta directamente map, filter, reduce o forEach; hay que convertir a array.
  • No guarda posiciones como un array, por lo que tareas como drag and drop por índice son más complejas.

En síntesis, piensa en el patrón de uso: si predominan las consultas y cambios por ID, indexar por ID con diccionario o Map te da acceso inmediato. Si tu prioridad es recorrer, transformar y ordenar, array será más práctico.

¿Tú qué usas para manejar entidades por ID y por qué? Comparte tu enfoque y ejemplos en los comentarios.