Clases en JavaScript: constructor y métodos static

Aprende a pasar de objetos literales y funciones constructoras a clases en JavaScript con una sintaxis clara y moderna. Verás cómo class en ECMAScript 6 es azúcar sintáctica sobre prototype, cómo mover métodos compartidos a la clase y cómo un método static corrige errores reales al generar un ID único.

¿Qué cambia con clases en JavaScript frente a funciones constructoras?

La clase organiza cómo se ve y se comporta un tipo de objeto. Piensa en un molde que crea muchas instancias con sus propios datos. Aunque uses la palabra reservada class, por debajo siguen existiendo funciones constructoras y prototipos.

¿Por qué class es azúcar sintáctica en ECMAScript 6?

• Mejora la lectura y la intención del código.
• Mantiene el modelo basado en prototype que ya conoces.
• Facilita declarar métodos sin escribir objeto.prototype.cadaVez.

¿Cómo opera this y new al instanciar?

• this apunta a la nueva instancia creada.
• new devuelve el objeto construido sin alterar el flujo previo.
• La clase actúa como un contrato claro para construir objetos.

¿Qué pasa con el prototype y métodos compartidos?

• Los métodos definidos dentro de la clase siguen siendo compartidos entre instancias.
• Se evita escribir habit.prototype.metodo manualmente.
• Se conserva la optimización del código por uso de prototype.

¿Cómo se implementa la clase habit y sus métodos?

Migrar desde una función constructora es directo: se renombra en PascalCase, se define el constructor, se mueven métodos al cuerpo de la clase y se reemplaza el contador global por un método static que genera el ID.

class Habit {
  constructor(name, frequency) {
    this.id = Habit.createID(); // sin variable global.
    this.name = name;
    this.frequency = frequency;
    this.createdAt = new Date(); // fecha de creación.
  }

  // método compartido por todas las instancias.
  rename(newName) {
    this.name = newName;
  }

  // método estático: pertenece a la clase, no a la instancia.
  static createID() {
    // versión corregida para evitar decimales con parseInt.
    return Date.now() + Math.floor(Math.random() * 1000);
  }
}

// instanciación, mismo flujo que con funciones constructoras.
const habit = new Habit('Correr', 'Diaria');

¿Cómo definir el constructor y propiedades?

• Define parámetros: name, frequency.
• Asigna propiedades con this: id, name, frequency, createdAt.
• Llama a Habit.createID() para generar el ID único.

¿Cómo migrar métodos del prototype a la clase?

• Escribe el método dentro del cuerpo de la clase.
• Sigue siendo compartido entre instancias vía prototype.
• Ejemplo: rename(newName) actualiza this.name.

¿Cómo instanciar con new sin cambiar el flujo?

• Usa: new Habit(nombre, frecuencia).
• Devuelve el objeto listo para usarse.
• No rompe la lógica previa de la aplicación.

¿Por qué usar un método estático para generar IDs sin errores?

Un método static pertenece a la clase y no a las instancias. Ideal para encapsular lógica interna, como generar el ID cuando se construye el objeto. Así no dependes de valores globales y mejoras la claridad.

¿Qué bug produjo parseInt con IDs decimales?

• Primera versión: Date.now() + Math.random generó decimales.
• En otra parte, al leer el ID con parseInt, se truncó la parte decimal.
• Resultado: “hábito no encontrado” al no coincidir los IDs.

// Versión problemática.
static createID() {
  return Date.now() + Math.random(); // decimales que parseInt trunca.
}

¿Cómo corregir la generación de IDs con Math.floor?

• Mantén Date.now() como base única en milisegundos.
• Multiplica Math.random() por 1000 y aplica Math.floor para evitar decimales.
• Garantiza enteros compatibles con parseInt y reduce colisiones.

// Versión corregida.
static createID() {
  return Date.now() + Math.floor(Math.random() * 1000);
}

¿Cuándo usar static en una clase?

• Cuando la lógica solo le compete a la clase: no a cada instancia.
• Para factorías internas, validaciones comunes o utilidades de la clase.
• Para encapsular y eliminar dependencias globales.

¿Tienes otra forma de generar IDs o mejoras al flujo con clases? Comparte tu enfoque y cuéntanos cómo lo resolviste en tus proyectos.