TypeScript Academy · Lección

Decoradores de métodos y propiedades

Decore métodos y propiedades individuales.

Decoradores de métodos y propiedades es una lección gratuita de TypeScript Academy en CoddyKit. Esta es la lección 2 de 4. Puedes leer la lección completa abajo gratuitamente — luego la practicas en el navegador con un editor de código integrado y un tutor de IA 24/7. Forma parte de la ruta de aprendizaje de TypeScript Academy, y tu progreso se sincroniza en la web y la app de CoddyKit. El curso de TypeScript Academy incluye 4 lecciones en total.

Bienvenida

Esta lección aborda los decoradores de métodos y propiedades en TypeScript.

Introducción

Los decoradores son una propuesta de JavaScript de fase 3 y una funcionalidad experimental de TypeScript para añadir metadatos y modificar clases y sus miembros.

Concepto principal

Un decorador es una función que se aplica a una clase, un método, una propiedad o un parámetro mediante la sintaxis @.

@sealed
class BugReport {
  type = 'report';
  title: string;
  constructor(t: string) { this.title = t; }
}

Decorador de clase

Los decoradores de clase reciben la función constructora y pueden devolver una versión modificada.

function sealed(constructor: Function) {
  Object.seal(constructor);
  Object.seal(constructor.prototype);
}

Decorador de método

Los decoradores de método reciben el objetivo, el nombre de la propiedad y el descriptor de propiedad.

function log(target: any, key: string, desc: PropertyDescriptor) {
  const orig = desc.value;
  desc.value = function(...args: any[]) {
    console.log('Calling', key);
    return orig.apply(this, args);
  };
}

Decorador de propiedad

Los decoradores de propiedad reciben el objetivo y la clave de propiedad. No pueden interceptar directamente las lecturas y escrituras.

function readonly(target: any, key: string) {
  Object.defineProperty(target, key, { writable: false });
}

Decorador de parámetro

Los decoradores de parámetro reciben el objetivo, el nombre del método y el índice del parámetro.

function required(target: any, key: string, index: number) {
  const meta = Reflect.getMetadata('required', target, key) || [];
  meta.push(index);
  Reflect.defineMetadata('required', meta, target, key);
}

Fábricas de decoradores

Una fábrica de decoradores es una función que devuelve un decorador. Recibe parámetros de configuración.

function role(name: string) {
  return function(target: any, key: string) {
    Reflect.defineMetadata('role', name, target, key);
  };
}

class UserController {
  @role('admin')
  deleteUser() {}
}

Decoradores de NestJS

NestJS usa ampliamente los decoradores para controladores, inyección de dependencias y enrutamiento.

@Controller('users')
class UsersController {
  constructor(private usersService: UsersService) {}

  @Get()
  findAll(): User[] {
    return this.usersService.findAll();
  }
}

reflect-metadata

Los decoradores suelen trabajar con el polyfill reflect-metadata para almacenar y recuperar metadatos en tiempo de ejecución.

import 'reflect-metadata';
// Enable in tsconfig: experimentalDecorators: true, emitDecoratorMetadata: true

Orden de los decoradores

Varios decoradores en la misma declaración se aplican de abajo arriba; el último escrito se evalúa primero.

@first
@second
class Example {}
// Applied: second first, then first

Comprobación rápida

¿Qué configuración de TypeScript se necesita para usar decoradores?

Resumen

Los decoradores usan la sintaxis @ para modificar clases, métodos, propiedades y parámetros. Se habilitan con experimentalDecorators en tsconfig y los utilizan ampliamente frameworks como NestJS y Angular.

Preguntas frecuentes

¿La lección «Decoradores de métodos y propiedades» es gratis?

Sí — el texto completo de «Decoradores de métodos y propiedades» es gratis para leer aquí en la web. Para practicarla de forma interactiva (editor de código integrado y tutor de IA 24/7) y desbloquear el resto del curso de TypeScript Academy, actualiza a CoddyKit PRO. El curso de TypeScript Academy incluye 4 lecciones en total.

¿Qué aprenderé en «Decoradores de métodos y propiedades»?

Decore métodos y propiedades individuales. Practicas TypeScript Academy con código real que ejecutas directamente en el navegador, y un tutor de IA 24/7 responde tus preguntas mientras trabajas en la lección.

¿Necesito experiencia previa para empezar TypeScript Academy?

No se requiere experiencia previa. TypeScript Academy en CoddyKit está estructurado para principiantes hasta estudiantes avanzados, así que puedes empezar aquí o desde el inicio y avanzar a tu ritmo. Esta es la lección 2 de 4.

¿Cuánto tiempo toma la lección «Decoradores de métodos y propiedades»?

La mayoría de las lecciones de CoddyKit toman alrededor de 5–10 minutos. Cada una es compacta e interactiva, así que avanzas constantemente y retomas exactamente por donde dejaste en la web y la app.

¿Puedo escribir y ejecutar código en esta lección de TypeScript Academy?

Sí. Cada lección de TypeScript Academy incluye un editor de código integrado, así que escribes y ejecutas código real directamente en tu navegador y obtienes retroalimentación instantánea de IA — sin configuración local necesaria.

Todas las lecciones de este curso

Decoradores de clase: encapsulación de comportamiento
Decoradores de métodos y propiedades
Decoradores de parámetros y metadatos
Decoradores en frameworks: ejemplo con NestJS

← Volver a TypeScript Academy