Volver a Patrones y Buenas Prácticas
Patrones y Buenas Prácticas — Leccion 4
·20 minDecorators
Modifica clases y métodos de forma declarativa.
Decorators
Los decorators son funciones que modifican clases, métodos, propiedades o parámetros.
typescript
function log(target: any, key: string, descriptor: PropertyDescriptor) {
const original = descriptor.value;
descriptor.value = function(...args: any[]) {
console.log(`Llamando a ${key} con`, args);
return original.apply(this, args);
};
}
class Calculadora {
@log
sumar(a: number, b: number) {
return a + b;
}
}
new Calculadora().sumar(1, 2); // Log: llamando a sumar con [1, 2]
Habilitar decorators
json
{
"compilerOptions": {
"experimentalDecorators": true,
"emitDecoratorMetadata": true
}
}
Tipos de decorators
typescript
// Class decorator
function sealed(constructor: Function) {
Object.seal(constructor);
Object.seal(constructor.prototype);
}
// Property decorator
function minLength(largo: number) {
return (target: any, key: string) => {
// ...
};
}
// Method decorator
function debounce(ms: number) {
return (target: any, key: string, descriptor: PropertyDescriptor) => {
// ...
};
}
Ejemplo real
typescript
function autorizado(roles: string[]) {
return function (target: any, key: string, descriptor: PropertyDescriptor) {
const original = descriptor.value;
descriptor.value = function (...args: any[]) {
const usuario = args[0];
if (!roles.includes(usuario.rol)) {
throw new Error("No autorizado");
}
return original.apply(this, args);
};
};
}
class Admin {
@autorizado(["admin"])
eliminarUsuario(usuario: any) {
return "Usuario eliminado";
}
}
Ejercicio pratico
Crea un decorator @log que registre las llamadas a funciones.
exercise.ts
Loading...
Resultado
Haz clic en "Ejecutar" para ver el resultado...