TypeScript
Decoratore di classe

Parametri

Decoratore di classe base

Un decoratore di classe è solo una funzione che considera la classe come il suo unico argomento e la restituisce dopo aver fatto qualcosa con esso:

function log<T>(target: T) {
    
    // Do something with target
    console.log(target);
    
    // Return target
    return target;

}

Possiamo quindi applicare il decoratore di classe a una classe:

@log
class Person {
    private _name: string;
    public constructor(name: string) {
        this._name = name;
    }
    public greet() {
        return this._name;
    }
}

Generazione di metadati usando un decoratore di classe

Questa volta dichiareremo un decoratore di classe che aggiungerà alcuni metadati a una classe quando ci siamo applicati:

function addMetadata(target: any) {
    
    // Add some metadata
    target.__customMetadata = {
        someKey: "someValue"
    };
    
    // Return target
    return target;

}

Possiamo quindi applicare il decoratore di classe:

@addMetadata
class Person {
    private _name: string;
    public constructor(name: string) {
        this._name = name;
    }
    public greet() {
        return this._name;
    }
}

function getMetadataFromClass(target: any) {
    return target.__customMetadata;
}

console.log(getMetadataFromClass(Person));

Il decoratore viene applicato quando la classe viene dichiarata non quando creiamo istanze della classe. Ciò significa che i metadati sono condivisi tra tutte le istanze di una classe:

function getMetadataFromInstance(target: any) {
    return target.constructor.__customMetadata;
}

let person1 = new Person("John");
let person2 = new Person("Lisa");

console.log(getMetadataFromInstance(person1));
console.log(getMetadataFromInstance(person2));

Passare argomenti a un decoratore di classe

Possiamo avvolgere un decoratore di classe con un'altra funzione per consentire la personalizzazione:

function addMetadata(metadata: any) {
    return function log(target: any) {
    
        // Add metadata
        target.__customMetadata = metadata;
        
        // Return target
        return target;
    
    }
}

addMetadata prende alcuni argomenti usati come configurazione e quindi restituisce una funzione senza nome che è il vero decoratore. Nel decoratore possiamo accedere agli argomenti perché c'è una chiusura sul posto.

Possiamo quindi invocare il decoratore passando alcuni valori di configurazione:

@addMetadata({ guid: "417c6ec7-ec05-4954-a3c6-73a0d7f9f5bf" })
class Person {
    private _name: string;
    public constructor(name: string) {
        this._name = name;
    }
    public greet() {
        return this._name;
    }
}

Possiamo usare la seguente funzione per accedere ai metadati generati:

function getMetadataFromClass(target: any) {
    return target.__customMetadata;
}

console.log(getMetadataFromInstance(Person));

Se tutto è andato bene, la console dovrebbe mostrare:

{ guid: "417c6ec7-ec05-4954-a3c6-73a0d7f9f5bf" }