JavaScript de Cero a Experto / POO en JS
Clases: fabricar objetos en serie
Tus objetos del módulo 5 se escriben uno por uno, a mano. Pero "Mi
Bolsillo" real necesita CIENTOS de gastos con la misma forma y el mismo
comportamiento — y escribirlos a mano no escala. La programación orientada
a objetos (POO) empieza aquí: un MOLDE que fabrica objetos en serie. En
JavaScript, ese molde se llama class.
El problema: objetos artesanales
Sin molde, cada gasto se fabrica a mano — y si quieres que además SEPA hacer cosas (formatearse, evaluarse), le copias las funciones a cada uno:
const gasto1 = {
nombre: "Almuerzo",
valor: 18000,
esCaro() { return this.valor > 20000; },
};
const gasto2 = {
nombre: "Cine",
valor: 25000,
esCaro() { return this.valor > 20000; }, // copiada... otra vez
};Dos gastos y ya hay código duplicado. Con cien, cualquier cambio en
esCaro es una cacería por todo el proyecto — y cada copia ocupa su
propia memoria. Necesitamos declarar la FORMA una sola vez.
El molde: class
Anatomía del molde: class Gasto declara el molde (por convención, con
mayúscula inicial — así distingues moldes de objetos a simple vista);
constructor es la función que corre al fabricar, donde this es la
instancia naciendo y cada this.campo = valor le instala un dato propio;
los demás métodos se escriben sin la palabra function (como los
shorthand del módulo 5) y quedan disponibles en TODAS las instancias.
new: la palabra que acciona la máquina
new Gasto(...) hace cuatro cosas: crea un objeto vacío, lo conecta al
molde, ejecuta el constructor con this apuntando a ese objeto, y te lo
entrega. Olvidar el new no fabrica nada — y JavaScript, en un raro gesto
de claridad, revienta con un error explícito en vez de fallar en silencio:
// ✗ TypeError: Class constructor Gasto cannot be invoked without 'new'
const g = Gasto("Almuerzo", 18000, "comida");Nota honesta de contexto: las clases NO reemplazan a los objetos literales del módulo 5. Para un dato suelto, una config, un parámetro — el literal sigue siendo el rey. La clase paga cuando fabricas MUCHOS objetos con la misma forma Y el mismo comportamiento: gastos, usuarios, productos, enemigos de un juego. Molde para lo repetido, literal para lo puntual.
Fabricas const a = new Gasto('Bus', 5800, 'transporte') y const b = new Gasto('Cine', 25000, 'ocio'), y luego haces a.valor = 6000. ¿Qué le pasa a b?
Mini-reto
Fabrica tu primer molde para "Mi Bolsillo": una clase Titular con
nombre, ciudad y saldo en el constructor, y dos métodos:
presentarse() (devuelve "Soy X, de Y" con template literal) y
puedePagar(valor) (booleano contra el saldo). Crea dos titulares,
comprueba que modificar el saldo de uno no toca al otro, y remata con un
array de 3 gastos creado con new dentro de un map sobre datos crudos:
datos.map((d) => new Gasto(d.nombre, d.valor, d.categoria)) — el molde y
el módulo 4, unidos.
Qué sigue
Habrás notado que todo gira alrededor de this — y this es famoso por
traicionar: funciona en el método, y de repente es undefined en un
callback. En el módulo 5 te prometimos la explicación completa; la próxima
lección la cumple: las cuatro reglas de this, de una vez y para siempre.