Contenido del curso

Herencia de clases con extends en TypeScript

Resumen

Extender clases en TypeScript te permite crear una nueva clase que hereda propiedades y métodos de otra sin modificar la original. Con la palabra reservada extends puedes ampliar una clase base como Persona y construir variantes especializadas como Empleado, sumando nuevas propiedades y comportamientos. Es una técnica clave para reutilizar código en proyectos orientados a objetos.

¿Qué significa extender una clase en TypeScript?

Extender significa tomar una clase existente y crear una nueva que herede todo lo que ya tiene, sin tocar el archivo original. La idea es simple: tu clase Persona ya define nombre, edad y esDesarrollador, y tú quieres una versión más específica que además guarde un puesto laboral. En lugar de duplicar código, usas extends y partes desde donde la clase base te dejó [00:18].

¿Qué hace la palabra clave extends? Le indica a TypeScript que la nueva clase hereda propiedades y métodos de la clase base. Así puedes reutilizar la lógica original y añadir solo lo nuevo.

Este enfoque respeta el principio de no modificar lo que ya funciona. Tu clase Persona queda intacta y tu clase Empleado se monta encima como una capa adicional.

¿Cómo crear una clase Empleado que extiende de Persona?

Lo primero es organizar tus archivos. En lugar de meter todo en un solo .ts, conviene crear un archivo nuevo, por ejemplo empleado.ts, e importar ahí la clase Persona desde su archivo original [00:55]. Después declaras la nueva clase con la sintaxis:

ts import { Persona } from "./clase";

export class Empleado extends Persona { public puesto: string;

constructor(nombre: string, edad: number, esDesarrollador: boolean, puesto: string) { super(nombre, edad, esDesarrollador); this.puesto = puesto; }

saludar(): string { return Hola, trabajo como ${this.puesto}; }

obtenerInfo(): string { return Tengo ${this.edad} años y trabajo como ${this.puesto}; } }

¿Por qué el constructor recibe todas las propiedades?

Porque al heredar, el constructor de la clase hija debe pasarle a la clase padre los valores que esta necesita para inicializarse. Por eso el constructor de Empleado recibe nombre, edad y esDesarrollador, y además agrega puesto como propiedad propia [01:35]. Así puedes sobrescribir cualquier valor heredado al momento de crear el objeto.

¿Por qué usar export en la clase hija?

Sin export, la clase no puede importarse desde otros archivos. Es el detalle que muchos olvidan y que rompe la cadena de reutilización [02:30]. Si quieres usar Empleado en main.ts, exportarla es obligatorio.

¿Cómo instanciar y probar la clase extendida?

Crea un archivo main.ts dentro de la misma carpeta y dentro importa la clase Empleado. A partir de ahí instancias un objeto igual que harías con cualquier clase, pasando los cuatro valores al constructor:

ts import { Empleado } from "./empleado";

const empleado = new Empleado("Tu nombre", 30, true, "Frontend Developer");

console.log(empleado.saludar()); console.log(empleado.obtenerInfo()); console.log(empleado.nombre);

Fíjate que puedes acceder tanto a métodos nuevos como saludar y obtenerInfo, como a propiedades heredadas como nombre. Esa es la magia de la herencia: el objeto empleado tiene acceso completo a todo lo que Persona definió, más lo que Empleado añadió encima.

¿Puedo sobrescribir métodos heredados? Sí. Si la clase hija define un método con el mismo nombre que la clase padre, el método de la hija reemplaza al original al ejecutarse desde una instancia hija.

¿Cómo funciona el efecto cascada al compilar TypeScript?

Aquí viene una de las partes más útiles del flujo de trabajo. Cuando compilas con tsc main.ts, no necesitas compilar manualmente cada archivo dependiente. TypeScript detecta las importaciones y compila en cascada todo lo que main necesita [03:55].

  • Compilas main.ts con tsc main.ts.
  • TypeScript detecta que main importa Empleado, así que compila empleado.ts.
  • A su vez, Empleado importa Persona, así que también compila clase.ts.
  • Ejecutas el resultado con node main.js.

Es un dominó: un solo comando dispara la compilación de toda la cadena de dependencias. Esto reduce fricción durante el desarrollo y mantiene tu carpeta limpia hasta que realmente necesitas los archivos .js.

¿Qué debo tener en cuenta al llevar esto a producción?

Un detalle crítico: aunque en desarrollo te alcance con compilar solo main.ts, cuando despliegues una solución productiva debes incluir todos los archivos JavaScript generados. Si falta uno, las referencias se rompen y la aplicación no funciona [05:25]. La cascada te ahorra trabajo en local, pero el bundle final tiene que estar completo.

¿Ya probaste extender una clase en tu propio proyecto? Cuéntame en los comentarios qué clase base usaste y qué nuevas propiedades añadiste con extends.