typescript - 如何在 TypeScript 中为具有动态属性的对象定义类型

Question

我有一个对象，它的 title 是字符串，order 是数字，然后上面会有动态数字类型的属性

所以我试着像下面这样定义它

appraisalGroups: Array<{
    title: string,
    order: number,
    [key:string]: number,
}>;

稍后将像这样分配(这只是我的读取应用程序中的一个示例，将有一个循环并且 key 来自 rest api)

this.appraisalGroups[0]['mykey1'] = 5

我得到了 ts 错误

Property 'title' of type 'string' is not assignable to string index type 'number'

我的问题是如何输入？

https://stackblitz.com/edit/angular-mzdwmn

Answer 1

你得到这个是因为索引签名强制所有属性匹配它们的返回类型。如 Typescript 文档所述:https://www.typescriptlang.org/docs/handbook/interfaces.html

While string index signatures are a powerful way to describe the dictionary pattern, they also enforce that all properties match their return type.

索引签名明确表示“每当此对象使用此类型的值进行索引时，它将返回该类型的值”。

在你的例子中，你的索引签名说“只要这个对象被一个字符串索引，它就会返回一个数字”。但是，编译器发现此规则可能会被破坏，因为您的其中一个属性不是数字，因此会抛出错误。

我不确定你的问题空间是什么，但如果动态属性都有一些共同点，那么创建一个接口(interface)来抽象它们的共同点可能会更容易。不过，您如何使用所述界面实际上取决于您想要做什么。

编辑:您也可以厚颜无耻地走捷径，只使用 Union 类型。因此，您可以使用 [key:string]: number | 而不是 [key:string]: number字符串.