Construcción de Grafos: Método Lista de Adyacencia en JavaScript

Construir un grafo no dirigido en JavaScript es más simple de lo que parece: con una representación tipo JSON List (objeto con arrays), un constructor claro y dos métodos (addVertex y addEdge), obtienes una estructura sólida para practicar lógica y conexiones entre datos. Aquí verás los pasos exactos, el código mínimo y cómo validar las relaciones entre nodos.

¿Cómo modelar un grafo no dirigido con adjacent list en JavaScript?

Un grafo se compone de vértices (nodos) y bordes (conexiones o edges). La clase inicia sin valor y usa un objeto para mapear cada nodo a un array con sus vecinos. Además, mantiene un contador de nodos para ubicar por índice.

¿Qué hace el constructor y cómo se representa con JSON List?

• Crea la instancia del grafo sin valor inicial.
• Define dis.nodos para el conteo de vértices.
• Define dis.jsonList como objeto: cada clave es un nodo y su valor es un array de conexiones.

class Grafo {
  constructor() {
    this.nodos = 0;
    this.jsonList = {}; // representación tipo *JSON List*: objeto de arrays
  }

  addVertex(nodo) {
    this.jsonList[nodo] = []; // cada vértice inicia con un array vacío
    this.nodos++;
  }

  addEdge(n1, n2) {
    // grafo no dirigido: se agregan ambas conexiones con *push*
    this.jsonList[n1].push(n2);
    this.jsonList[n2].push(n1);
  }
}

¿Qué implica usar índices y arrays en la estructura?

• Cada nodo es una clave del objeto: índice legible y directo.
• Cada array lista a qué nodos conecta ese vértice.
• Con push agregas vecinos sin duplicar estructura.

¿Cómo agregar vértices y bordes (edges) paso a paso?

Primero se crean los vértices; luego se conectan con bordes. La verificación final confirma que la adjacent list refleja exactamente las conexiones esperadas.

const g = new Grafo();

// 1) Agregar vértices (vértices: 1, 3, 4, 5, 6, 8)
[1, 3, 4, 5, 6, 8].forEach(v => g.addVertex(v));

// 2) Agregar bordes para un grafo no dirigido
// conexiones validadas posteriormente en la *adjacent list*
g.addEdge(1, 6);
g.addEdge(1, 3);
g.addEdge(1, 4);

g.addEdge(3, 5);
g.addEdge(3, 6);

g.addEdge(4, 5);
g.addEdge(4, 8);

console.log(g.jsonList);
/*
{
  1: [6, 3, 4],
  3: [5, 6, 1],
  4: [1, 5, 8],
  5: [3, 4],
  6: [3, 1],
  8: [4]
}
*/

¿Cómo validar la adjacent list final por índice?

• 1 conecta con 6, 3, 4.
• 3 conecta con 5, 6, 1.
• 4 conecta con 1, 5, 8.
• 5 conecta con 3, 4.
• 6 conecta con 3, 1.
• 8 conecta con 4.

En un grafo no dirigido, cada borde aparece en ambos sentidos: la lógica de addEdge asegura la simetría agregando con push en los dos arrays involucrados.

¿Qué habilidades y conceptos refuerzas con este ejercicio?

Este ejercicio potencia tu comprensión práctica de estructuras de datos y su implementación en código sencillo pero preciso. Se trabaja desde la instanciación de clases y el constructor, hasta la representación con índices y arrays.

¿Qué habilidades técnicas aplicas en JavaScript?

• Diseño de una clase con estado interno: nodos y JSON List.
• Modelado de grafos con objeto de arrays: representación tipo adjacent list.
• Implementación de métodos: addVertex para crear vértices y addEdge para conectar nodos.
• Mutación controlada de colecciones con push.
• Verificación manual de conexiones por índice: lectura y comparación rápida.

¿Qué conceptos clave quedan claros?

• Grafo no dirigido: cada conexión es bidireccional por definición de edge.
• Vértices vs. bordes: primero agregas nodos, luego conectas relaciones.
• Lógica incremental: construir, probar, validar y ajustar con pocas líneas.
• Simplicidad efectiva: la claridad de la representación facilita depuración y expansión.

¿Te animas a probar una variante? puedes intentar un grafo dirigido o crear nuevas conexiones y comentar cómo cambió tu adjacent list. ¡Comparte tus resultados y dudas!