🔥 Decorators, Composition (composición)

Se pueden aplicar múltiples decoradores a una declaración, por ejemplo en una sola línea:

@f @g x

O en líneas múltiples:

@f
@g
x

Cuando múltiples decoradores se aplican a una declaración sencilla, su valor es similar a una función de composición en Matemáticas. En este modelo las funciones f y g, el resultado de la composición es (f * g)(x) es equivalente a f(g(x)).

Por ello, la forma en la que se evalúan los decoradores es la siguiente:

  1. La expresión para cada decorador es evaluada de arriba hacia abajo.
  2. Los resultados son entonces invocados como funciones de abajo hacia arriba.

Si vamos a utilizar fabricas de decoradores, podemos observar el orden de esta evaluación con el siguiente ejemplo.

function f1() {
  console.log("f1 evaluada");
  return function (
    target: any,
    propertyKey: string,
    descriptor: PropertyDescriptor
  ) {
    console.log("f1 ejecutada");
  };
}

function f2() {
  console.log("f2 evaluada");
  return function (
    target: any,
    propertyKey: string,
    descriptor: PropertyDescriptor
  ) {
    console.log("f2 ejecutada");
  };
}

class ClaseEjemplo {
  @f1()
  @f2()
  saludar() {}
}

Salida…

f1 evaluada
f2 evaluada
f2 ejecutada
f1 ejecutada

☆ Evaluación de los decoradores

El orden en el que los decoradores es aplicado es el siguiente.

  1. Decoradores de parámetros (decoradores de parámetros), seguidos por Method Accesors o Decoradores de Propiedades son aplicados a cada instancia de cada miembro.
  2. Decoradores de parámetros, seguido por Method Accesors, o Decoradores de Propiedades son aplicados a cada miembro estático.
  3. Decoradores de parámetros, son aplicados al constructor.
  4. Decoradores de clases son aplicados a las clases.