在打字稿中使用与号运算符

Question

如何创建 AccessGroup 类型的变量

declare class AccessGroup {
    id: number;
    active: boolean;
    display_name: string;
    description: string;
    access_group_features: [];
    created_at?: Date;
    created_by?: string;
    updated_at?: Date;
    updated_by?: string;
    static fromJSON(json: any): any;
    toJSON(): this & {
        access_group_features: any;
    };
}

我想的是我们可以这样做

let x:AccessGroup={
id:1,
active:false,
display_name:'',
description:'',
access_group_features:[]
toJSON(): ?
}

但它给出了一个错误，因为将某些东西分配给 toJSON() 是强制性的并且不知道这一点，除了如果我没记错的话 & 就像一个交集一样工作

有人可以举例说明如何为变量定义 toJSON()

Answer 1

您只需像在 class 中一样实施它。这意味着你return一个对象是基于对象运行的方法，加上一个额外的属性.

看起来像 { ...this, extraProp: 'whatever' }

declare class AccessGroup {
    id: number;
    active: boolean;
    display_name: string;
    toJSON(): this & {
        access_group_features: any;
    };
}

let x: AccessGroup = {
    id: 123,
    active: true,
    display_name: 'Testing 123',
    toJSON() {
        return {
            ...this,
            toJSON: this.toJSON, // Make typescript happy
            access_group_features: 'Test'
        }
    }
}

只要您像 x.toJSON() 这样调用该方法，那么 this 就会成为 x 对象，一切都会正常工作。

正如您可能注意到的那样，我需要显式传递 toJSON 方法，因为 ...this 中没有包含该方法。我相信这是因为在 class 中，方法不可枚举。方法存储在 class 原型中，因为它们不会随实例改变。这意味着打字稿不相信 toJSON 将是 { ...this }

的属性

至少我认为，这个有点棘手。

Playground

但是在 toJSON() 的 return 中有任何功能可能也不对。所以你可能根本不想包括它。

如果您将类型更改为：

toJSON(): Omit<this, 'toJSON'> & {
    access_group_features: any;
};

那你可以省去方法：

toJSON() {
    return { ...this, access_group_features: 'Test' }
}

Playground

但是创建一个普通对象来实现带有方法的 class 接口并不理想。如果你真的能做到 class 然后去做 new AccessGroup() 你的生活可能会容易得多。

Answer 2

对@Alex Wayne 上面回答的内容做一个小改动。

原来的问题在 AccessGroup 中有另一个属性，称为 access_group_features，它是一个数组

declare class AccessGroup {
    id: number;
    active: boolean;
    display_name: string;
    description: string;
    access_group_features: [];
    created_at?: Date;
    created_by?: string;
    updated_at?: Date;
    updated_by?: string;
    static fromJSON(json: any): any;
    toJSON(): this & {
        access_group_features: any;
    };
}

So the access_group property in toJSON() member function should also be of the type array ( any other type throws an error as ampersand operator in typescript intersects the properties and hence should be of the same type)

toJSON(): this & {
            access_group_features: [];    /* this is probably because of strict type checking in typescript */
        };

所以创建的变量看起来像这样：

let x: AccessGroup = {
    id: 123,
    active: true,
    display_name: 'Testing 123',
    access_group_features:[],
    toJSON() {
        return {
            ...this,
            toJSON: this.toJSON,
            access_group_features: []
        }
    }
}

在打字稿中使用与号运算符

Using the ampersand operator in typescript

json

this

ampersand

typescript

angular