Question

我正在玩Typescript装饰器，当我实例化一个类时，一切工作都很好。通过以下代码，我的类装饰器被调用：import { MyClass } from "./MyClass"; const myClass = new MyClass(); 但是，当我不像上面的示例那样显式实例化该类时，不会调用任何装饰器。例如，以下模块：https://github.com/xrobert35/es-mapping-ts依靠这种结构将所有类保存在存储器中并生成映射。我尝试过不首先实例化类并生成映射，但是它也不起作用。 在实例化装饰器所在的类之前，是否需要设置Webpack或Typescript配置以使装饰器得以执行？就我所知和一些在线教程中所定义的，类装饰器是在定义类时调用，而不是在实例化该类时调用。干杯！

Answer 1

您可以使用类级别的装饰器替换原始的类构造器，以完成各种有趣的事情：

function example(target: any) {
    // save a reference to the original constructor
    const original = target;

    // the new constructor behaviour
    const f: any = function (...args: any[]) {
        console.log("Hook before original constructor...");

        const newArgs = [...args].reverse();

        const instance = new original(...newArgs);

        console.log("Hook after original constructor...");

        instance.d = 'ddd';

        return instance;
    }

    // copy prototype so intanceof operator still works
    f.prototype = original.prototype;

    // return new constructor (will override original)
    return f;
}

@example
class SomeClass {
    constructor(public a: number, public b: number, public c: number) {
        console.log("Hello from constructor!")
    }
}

const instance1 = new SomeClass(1, 2, 3);
console.log(instance1); // SomeClass {a: 3, b: 2, c: 1, d: "ddd"}

Link to playground

类实例之前的Typescript装饰器

1 个答案: