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

【问题标题】：What is the correct TypeScript interface for an object with one or more properties of the same type?对于具有一个或多个相同类型属性的对象，正确的 TypeScript 接口是什么？
【发布时间】：2019-06-16 15:05:54
【问题描述】：

我正在学习 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？因为接口以某种方式读取了所有可能的意大利面类型，并且当一些没有出现在实际数据对象中时，它不得不说对于那些意大利面类型键（那些没有出现在对象中的) 值是undefined?

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

【问题讨论】：

What does the type { [key: string]: boolean; } mean?的可能重复
typescriptlang.org/docs/handbook/…
@wvteijlingen，确实，这里似乎可以解释：typescriptlang.org/docs/handbook/…。尽管如此，我还是很想知道为什么| undefined 是必要的——也就是说，TypeScript 会通过“编译时间”传递所有可能导入以使用该类型的数据，并且索引类型必须支持所有可能的键，其中一些返回undefined？如果数据是通过 API 调用读入的，它怎么知道| undefined 是必要的？
谁说有undefined是必要的？ Typescript 在运行时不做任何检查。从您提供的 json 来看，那里似乎没有必要有 undefined。
[key: string]: number | undefined 表示接口的实例应具有其所有属性的名称，例如'spaghetti'，是字符串类型，对应的值应为数字或未定义。我认为 typescript 在运行时不会检查真实类型。

标签： typescript interface

【解决方案1】：

正确的答案是我使用的是可索引类型（请参阅https://www.typescriptlang.org/docs/handbook/interfaces.html#indexable-types），在回答this 问题时演示了它的使用。

【讨论】：