Cansado de ver todo el tiempo ese /@algo regado por todo mi código decidí averiguar un poco acerca de esto 😉.
Bien pues resulta que eso hace referencia a un Decorador en Typescript y para llegar a entender un poco como funciona empecemos un poco desde lo básico
¿Qué es un decorador?
El patrón Decorator responde a la necesidad de de añadir dinámicamente funcionalidad a un objeto. Esto nos permite no tener que crear sucesivamente clases que hereden de la primera incorporando la nueva funcionalidad
¿Cómo funciona?
Pues como bien lo define la Wikipedia se basa en añadir dinámicamente funcionalidades a una clase cada decorador puede agregar funcionalidad a una clase ; anular el resultado , hacer alguna operación con el.
¿En que aplicaría el patrón Decorador?
Bien, imagina que estas haciendo un tienda online por ende tienes una entidad producto, ahora para ese producto tenemos que calcular su precio, tendríamos algo como esto:
Bien ahora imagina que quisieras agregar un descuento y la lógica es tan complicada que decides separarlo en otra clase
Eso cumpliría con lo solicitado , pero que pasaría si con el tiempo usted empieza ha hacer delivery y desea aplicar otra lógica extra:
Bien ahora tiene un clase que aplica delivery y otra un descuento común y corriente (¿pero el delivery no es un descuento?🙄) , si pero es un ejemplo, ahora cuando quieras aplicar un descuento común llamas la clase con descuento solamente y cuando quieres aplicar delivery llamas a la clase con delivery
¿Y si quieres aplicar los dos al mismo tiempo?
Pues tendría que heredar las dos clases y llamar a esa clase withDeliveryAndDisccount y pues eso seria muy complicado. ¿Y que pereza no?
Decoradores al rescate
lo primero que haremos es declarar una interface, esta define las propiedades que pueden ser alteradas por los decoradores
Ahora empleemos un clase en concreto con las implementaciones por defecto
Ahora empleemos una clase decoradora que implementa la interfaz que las demás clases, el principal objetivo de esta clase es encapsular la clase en concreto.
Como vemos la clase solo esta delegando todo el trabajo al componen .
Ahora viene el primer decorador que aplicara un descuento a nuestro producto
Ahora el decorador que aplica la lógica de delivery sobre el precio
Ahora es totalmente fácil aplicar ambos al producto
Bien ahora solo nos falta ver los decoradores nativos typescript