Inicio > Cursos > TypeScript > Decoradores
TypeScriptTipos AvanzadosLección 11 de 18

Decoradores

Los decoradores son funciones especiales que "decoran" (agregan comportamiento a) clases, métodos, propiedades o parámetros. Se escriben con @ justo antes del elemento: un @Log() encima de un método hace que ese método pase por la función Log.

Los frameworks grandes los usan para definir su estructura: • NestJS: @Controller() marca una clase como controlador de rutas, @Get() marca un método que responde a GET y @Injectable() marca una clase que se puede inyectar en otras • Angular: @Component() define un componente visual • TypeORM: @Entity() marca una clase como tabla y @Column() una propiedad como columna

Un decorator factory es una función que recibe parámetros y devuelve el decorador real. Por ejemplo, @Log("PERFIL") primero llama a Log("PERFIL") que devuelve la función decoradora que se aplica al método. Esto los hace configurables. En la práctica, si planeas usar NestJS (el framework Node.js más popular en empresas), entender decoradores es fundamental porque toda la arquitectura se define con ellos: rutas, inyección de dependencias, validación, autenticación.

// tsconfig: "experimentalDecorators": true

// Decorador de clase
function Sellado(constructor: Function) {
  Object.seal(constructor);
  Object.seal(constructor.prototype);
}

// Decorador factory (con parámetros)
function Log(prefix: string) {
  return function(target: any, prop: string, descriptor: PropertyDescriptor) {
    const original = descriptor.value;
    descriptor.value = function(...args: any[]) {
      console.log(`[${prefix}] ${prop}(${args.join(", ")})`);
      const result = original.apply(this, args);
      console.log(`[${prefix}] → ${result}`);
      return result;
    };
    return descriptor;
  };
}

function Readonly(target: any, prop: string, descriptor: PropertyDescriptor) {
  descriptor.writable = false;
  return descriptor;
}

@Sellado
class Calculadora {
  @Log("CALC")
  sumar(a: number, b: number): number {
    return a + b;
  }

  @Readonly
  @Log("CALC")
  dividir(a: number, b: number): number {
    return a / b;
  }
}

const calc = new Calculadora();
calc.sumar(2, 3);
// [CALC] sumar(2, 3)
// [CALC] → 5

// En NestJS, los decoradores definen la arquitectura:
// @Injectable(), @Controller("/users"), @Get("/:id"), @Body()
Consejo🏗️ Los decoradores son el núcleo de NestJS (el framework Node.js más popular para empresas). Si planeas usarlo, entender decoradores es esencial.
← Template Literal Types y satisfiesMódulos y Declaration Files →

Practica esta lección

Resuelve los ejercicios del curso de TypeScript en la app, gratis y con corrección automática.

Empezar a practicar