打字稿语法答案

【问题标题】：Typescript syntax打字稿语法
【发布时间】：2019-04-18 16:48:33
【问题描述】：

我是 TypeScript 的新手，并且在我公司的一个大量使用它的 repos 中工作。（我们正在构建一个 React/Redux 应用程序。）我对 TypeScript 泛型的基本概念很熟悉，但有一点特别令人困惑。这是有问题的代码示例（它在减速器中）：

interface EntityState<Entity> {
  entity?: Entity;
  status: ApiStatus; // enum
}

interface FieldSummary {
    dataType?: string;
    // other properties...
}

function singleField(state: EntityState<FieldSummary> = defaultEntityState, 
  action: ActionTypes) {...}

有人能解释EntityState<FieldSummary> 在做什么吗？如果需要更多详细信息，请告诉我。

【问题讨论】：

它是泛型类型EntityState<FieldSummary> 的实例化，将等同于类型{ entity?: FieldSummary; status: ApiStatus; } .. 不确定什么不清楚..
是您定义的任何类型，您可以稍后传入。我在这里记录了 React Typescript 语法 - syntax.wiki

标签： reactjs typescript react-redux typescript-generics

【解决方案1】：

这是一个泛型类型参数的示例。

interface EntityState<Entity> {
  entity?: Entity;
  status: ApiStatus;
}

接口将包含一个稍后定义的类型的可选entity?。目前，它被称为Entity。

当你使用这个接口时，你提供了类型，因此：

const stringEntity: EntityState<string>;

属性stringEntity.entity 将是string 或undefined（假设它是可选的）。

const numEntity: EntityState<number>;

属性numEntity.entity 将是number 或undefined。

等等。您在使用接口时提供的类型参数可以是满足任何约束的任何类型 - 在您的情况下，类型参数是不受约束的。这意味着您可以重用接口，因为类型是稍后定义的。

【讨论】：

所以，要清楚，EntityState<FieldSummary> 意味着state 参数应该具有来自EntityState 接口的status 属性，并且可以选择具有任何类型的entity 属性FieldSummary 是？
@jdmac - 是的。 EntityState<FieldSummary> 导致 myEntity.entity 的类型为 null | FieldSummary。
@AndyJ - 你说的很对。我犯了我以为你犯的错误！我已经更正了。
@Fenton 不用担心...... JavaScript 非常混乱，试图保持所有不同的东西，比如 null 和 undefined，以及在我自己的脑海中直截了当的“真实性”是很困难的！获得应得的赞。