Question

我正在学习TypeScript，最近我写了一个小型的React应用演示程序，用于处理有关面食偏爱的用户反馈数据。该应用程序读取JSON数据并对其进行过滤，以为每个用户提取我感兴趣的数据。在这种情况下，这些数据是用户的名称，性别和喜欢的面食，它们存储在一个对象中，该对象的键为意大利面名称（例如“ spaghetti”），其值是数字。

这些是我想出的界面，可以正常工作

export interface PastaData {
    [key: string]: number | undefined,
}

export interface UserData {
    name: string,
    gender:String,
    favorites: PastaData
}

因此我的用户数据将是UserData的数组

UserData[]

我的问题是，为什么“ PastaData”的第一个界面正常工作。在我的情况下，用户对象将类似于

{
name: 'Frank Frankson',
gender: 'male',
favorites: {
            'spaghetti':99.242342,
            'fusilli':42.5234234,
            'linguine':84.523422,
            'ravioli':92.234234
           }
}

那么为什么只有一个

[key: string]: number | undefined,

当真实对象中有多个该类型的实例时？ TypeScript类型如何检查对象-它是否在“编译”时读入JSON数据，然后针对接口进行检查？它是否仅检查一个条目，即“意大利面条”的条目，然后看是否合适，然后忽略其余条目？

为什么使用| undefined？因为接口以某种方式读取了所有可能的面食类型，并且当某些面食类型未出现在实际的数据对象中时，它不得不说对于那些面食类型键（那些未出现在对象中的键）） value 是undefined吗？

感谢您的见解！如前所述，通过我自己的研究并在Stack Overflow的帮助下，一切正常，但是我想对正在发生的事情加深理解。

Answer 1

正确的答案是我使用的是可索引类型（请参见https://www.typescriptlang.org/docs/handbook/interfaces.html#indexable-types），其使用在对this问题的回答中得到了证明。

具有一个或多个相同类型属性的对象的正确TypeScript接口是什么？

1 个答案: