TypeScript – nadpisywanie za pomocą dekoratorów

Jeśli dekoratory to dla Ciebie obcy temat to zapraszam do wprowdzenia.

Nadpisywanie konstruktora za pomocą dekoratorów

Co ciekawe TypeScript pozwala na napisanie konstruktora za pomocą dekoratorów.

Nadpisywanie konstruktora – dekorator bezargumentowy

Poniżej mamy najbardziej generyczną formę dekoratora nadpisującego konstruktor klasy. Możemy go zastosować na dowolnej klasie dzięki typowi generycznemu T.

function OrerrideConstructor<T extends {new(...args: any[]): any}>(constructorFunction: T){ 
    return class {
        constructor(...args: any[]){
            console.log('Overriding constructor');
        }
    }
};

Nadpisywanie konstruktora – dekorator przyjmujący argumenty

Jeśli potrzebujemy aby dekorator przyjmował argumenty, należy się posłużyć poniższą konstrukcją. Podobnie jak wyżej, możemy go zastosować na dowolnej klasie dzięki typowi generycznemu T.

function OverrideConstructor(...decoratorArgs: string[]){
    return function<T extends {new(...args: any[]): any}>(constructorFunction: T){
        return class {
            constructor(...args: any[]){
                console.log('Overriding constructor');
            }
        }
    };
}

Kilka słów o typie generycznym T

Spróbujmy rozłożyć na części pierwsze typ T:

T extends {new(...args: any[]): any}

T jest typem rozszerzającym obiekt (patrz nawiasy klamrowe):

T extends {}

T rozszerza obiekt który to posiada konstruktor:

T extends {new()}

T rozszerza obiekt który posiada konstruktor przyjmujący dowolną ilość argumentów dowolnego typu:

T extends {new(...args: any[])}

T rozszerza obiekt, który zwraca dowolny typ (jest dowolnej klasy):

T extends {new(...args: any[]): any}

Nadpisywanie metod

Możliwe jest także nadpisywanie metod klas. Przedstawiony tutaj przykład jest generyczny (będzie pasował do każdej metody):

function MethodOverride(target: any, methodName: string, descriptor: PropertyDescriptor) {
    let originalMethod = descriptor.value;
    descriptor.value = function(...args: any[]){
        originalMethod.apply(this, args);
        console.log('Overridden method');
    }
}

Warto zajrzeć

1. https://www.typescriptlang.org/docs/handbook/decorators.html
2. Moment i kolejność uruchamiania dekoratorów