Skip to main content

What is a decorator?

In TypeScript, decorators are a way to add additional behavior to classes, methods, properties, and other elements of the code. Decorators are functions that are invoked with a special syntax, and they can be used to modify or extend the behavior of the decorated element in various ways.

Decorators are typically used to add metadata or to implement cross-cutting concerns, such as logging, validation, or error handling. They can be applied to classes, methods, properties, accessors, parameters, or even local variables, and they can be defined and used in different ways.

Here is an example of using a decorator in TypeScript:

function log(target: any, propertyKey: string, descriptor: PropertyDescriptor) {
const originalMethod = descriptor.value;

descriptor.value = function(...args: any[]) {
console.log(`${propertyKey} method called with arguments: ${args}`);
return originalMethod.apply(this, args);
}

return descriptor;
}

class MyClass {
@log
public method1(a: number, b: number): number {
return a + b;
}
}

const obj = new MyClass();
obj.method1(1, 2); // logs: 'method1 method called with arguments: [1, 2]'

In this example, the log decorator is defined as a function that takes three parameters: the target object, the name of the decorated property, and the property descriptor. The decorator modifies the value property of the descriptor to wrap the original method in a logging function, and it returns the modified descriptor. The @log decorator is applied to the method1 method of the MyClass class, and it logs the arguments of the method whenever it is called.

Decorators are a powerful and flexible feature of TypeScript that can be used to add additional behavior to the code, and they can be useful for implementing cross-cutting concerns and for creating reusable and modular code. It is important to use decorators appropriately to ensure that they do not interfere with the intended behavior of the code, and to make the code easy to understand and maintain.