如何为对象数组定义一个接口?

33 浏览
0 Comments

如何为对象数组定义一个接口?

我有以下的接口和代码。我以为我正确地定义了它们,但是出现了一个错误:\n

interface IenumServiceGetOrderBy { id: number; label: string; key: any }[];
getOrderBy = (entity): IenumServiceGetOrderBy => {
    var result: IenumServiceGetOrderBy;
    switch (entity) {
        case "content":
            result =
            [
                { id: 0, label: 'CId', key: 'contentId' },
                { id: 1, label: 'Modified By', key: 'modifiedBy' },
                { id: 2, label: 'Modified Date', key: 'modified' },
                { id: 3, label: 'Status', key: 'contentStatusId' },
                { id: 4, label: 'Status > Type', key: ['contentStatusId', 'contentTypeId'] },
                { id: 5, label: 'Title', key: 'title' },
                { id: 6, label: 'Type', key: 'contentTypeId' },
                { id: 7, label: 'Type > Status', key: ['contentTypeId', 'contentStatusId'] }
            ];
            break;
    }
    return result;
};

\n错误:\n错误 190 无法将 \'{}[]\' 转换为 \'IenumServiceGetOrderBy\':\n类型 \'{}[]\' 缺少类型 \'IenumServiceGetOrderBy\' 的属性 \'id\'。

0
0 Comments

如何为对象数组定义接口?

问题的出现原因:

- OP要求定义一个接口,而不是使用类型,可能是因为接口可以扩展其他属性和方法,而类型更受限于通用可用性。

解决方法:

- 可以通过扩展Array接口来定义一个接口数组。如下所示:

export interface MyInterface extends Array<MyType> { }

- 这样,实现MyInterface接口的任何对象都需要实现数组的所有函数调用,并且只能存储具有MyType类型的对象。

其他内容:

- 如果不需要将其作为独立的特定接口,MyType[]也可以作为一种替代方法使用。

- 推荐使用接口而不是类型,官方的TypeScript文档中也这样建议。

- 使用{}是因为它是一个接口,我假设OP想要扩展数组接口。

0
0 Comments

问题的原因是需要定义一个接口来表示一个对象数组,但是在 TypeScript 中并没有直接支持定义数组接口的方式。解决该问题的方法是使用索引器(indexer)来定义接口。通过使用索引器,可以在接口中定义数组的索引类型以及对应的值类型。

具体而言,可以使用如下代码定义一个带有索引器的接口来表示对象数组:

interface EnumServiceGetOrderBy {
    [index: number]: { id: number; label: string; key: any };
}

这样就定义了一个名为 `EnumServiceGetOrderBy` 的接口,它表示一个对象数组,其中索引类型为 `number`,对应的值类型为包含 `id`、`label` 和 `key` 属性的对象。

需要注意的是,这种方式定义的接口并不是一个真正的数组接口,因此无法直接使用数组的属性和方法,例如 `length` 和 `push`。如果需要使用数组的属性和方法,可以考虑将该接口与实现了数组接口的类进行结合使用。

,通过使用索引器定义接口,可以很方便地表示一个对象数组。但是需要注意的是,这种方式定义的接口并不是一个真正的数组接口,无法直接使用数组的属性和方法,需要结合实现了数组接口的类进行使用。

0
0 Comments

如何为对象数组定义接口?

在上述内容中,问题的出现原因是希望定义一个适用于对象数组的接口。然后提供了两种解决方法。

解决方法一:

通过定义一个接口EnumServiceItem,并使用该接口的数组作为类型来定义一个变量result。代码如下:

interface EnumServiceItem {
    id: number; 
    label: string; 
    key: any;
}
var result: EnumServiceItem[] = [
    { id: 0, label: 'CId', key: 'contentId' },
    { id: 1, label: 'Modified By', key: 'modifiedBy' },
    { id: 2, label: 'Modified Date', key: 'modified' },
    { id: 3, label: 'Status', key: 'contentStatusId' },
    { id: 4, label: 'Status > Type', key: ['contentStatusId', 'contentTypeId'] },
    { id: 5, label: 'Title', key: 'title' },
    { id: 6, label: 'Type', key: 'contentTypeId' },
    { id: 7, label: 'Type > Status', key: ['contentTypeId', 'contentStatusId'] }
];

解决方法二:

通过定义一个继承自数组的接口EnumServiceItems,并将其作为类型来定义一个变量result。代码如下:

interface EnumServiceItem {
    id: number; 
    label: string; 
    key: any;
}
interface EnumServiceItems extends Array{}
var result: EnumServiceItems = [
    { id: 0, label: 'CId', key: 'contentId' },
    { id: 1, label: 'Modified By', key: 'modifiedBy' },
    { id: 2, label: 'Modified Date', key: 'modified' },
    { id: 3, label: 'Status', key: 'contentStatusId' },
    { id: 4, label: 'Status > Type', key: ['contentStatusId', 'contentTypeId'] },
    { id: 5, label: 'Title', key: 'title' },
    { id: 6, label: 'Type', key: 'contentTypeId' },
    { id: 7, label: 'Type > Status', key: ['contentTypeId', 'contentStatusId'] }
]

个人建议使用解决方法一,因为它在使用类而不是接口时迁移更简单。

另外,如果想要避免类型转换问题,可以在接口的所有声明中添加问号(?),例如:`id?: number; label?: string; key?: any`。这样可以避免在使用类型数组设置时指定比接口定义中更少的属性。

解决方法二也很有用,因为它允许在组合更高级别接口时使用该接口。

对于第二个接口声明,TSLint会出现以下错误提示:“interface声明没有成员等同于其父类型”。

建议将'key'的类型定义为string | string[],而不是any。例如:`interface EnumServiceItem { id: number; label: string; key: string | string[] }`。

TSLint会自动将其更正为`type EnumServiceItems = Array`,以避免上述错误。

0