typescript - 从 TypeScript 接口(interface)到类构造函数的快捷语法

Question

如果我有一个如下所示的 TypeScript 界面:

interface myInterface {
    prop1: string;
    prop2: string;
    prop3: number;
    prop4: boolean;
    ..
    ..
    ..
    prop30: string
}

我想创建一个实现 myInterface 的类，但我只知道详细的方法，如下所示:

class MyClass implements myInterface {
    prop1;
    prop2;
    prop3;
    prop4;
    ..
    ..
    prop30;

    constructor(data: myInterface) {
        this.prop1 = data.prop1;
        this.prop2 = data.prop2;
        this.prop3 = data.prop3;
        this.prop4 = data.prop4;
        ..
        ..
        this.prop30 = data.prop30;
    }
}

有什么方法可以让这个语法更短或者有更好的方法从接口(interface)实现这样的类吗？

Answer 1

您可以使用 Object.assign() 复制 data 的所有成员参数this立即，但 TypeScript 仍然要求您 declare the fields单独:

class MyClass implements MyInterface {
    prop1!: string;
    prop2!: string;
    prop3!: number;
    prop4!: boolean;
    /* ..
    ..
    ..*/
    prop30!: string;
    constructor(data: MyInterface) {
        Object.assign(this, data);
    }
}

所以这更好，但不是很好。

(另请注意，编译器无法验证属性是否已分配，因此您需要在字段声明中使用 definite assignment assertion operator ( ! ) 来抑制警告。)

---

如果您可以定义类工厂函数并使用它来生成父类(super class)，那么您就可以省去这个麻烦。函数如下:

function AssignCtor<T extends object>() {
    return class {
        constructor(t: T) {
            Object.assign(this, t)
        }
    } as { new(t: T): T }
}

返回值AssignCtor<T>是 asserted带有 construct signature 的类型接受 T 类型的值并生成一个类型为 T 的类实例。这就是您想要使用 MyInterface 执行的操作，让我们尝试一下:

class MyClass extends AssignCtor<MyInterface>() implements MyInterface {

}

就是这样。让我们确保MyClass行为符合您的预期:

function tryItOut(data: MyInterface) {
    const myClass = new MyClass(data);
    myClass.prop1.toUpperCase(); // okay    
}

看起来不错。值myClass可以看出具有 MyInterface 的属性.

Playground link to code