打字稿：如何定義具有許多未知鍵的對象

Question

我正在構建一個訪問 API 的應用程序，該 API 返回一個帶有許多未知鍵的對象，每個鍵代表一個用戶的 ID。

例子：

const response = {
  "random id1": {name: "user1"},
  "random id2": {name: "user2"},
  ...
  "random id100": {name: "user100"}
}

我知道如果我只有一個未知密鑰，我可以使用以下內容進行定義：

type MyDefinition = {
  [key: string]: Metadata
}

但是如何定義一個具有這么多不同鍵的對象呢？

Answer 1

[key: string]允許任意數量的唯一字符串作為鍵。

type Metadata = {
  name: string
}

type MyDefinition = {
  [key: string]: Metadata
}

const response: MyDefinition = {
  "random id1": {name: "user1"},
  "random id2": {name: "user2"},
  // ...
  "random id100": {name: "user100"},
};

在TypeScript Playground上試試

Answer 2

您可以使用通過模板字符串定義的類型，如下所示：

const response: { [key: `random id${number}`]: { name: string }} = {
  "random id1": {name: "user1"},
  "random id2": {name: "user2"},
  "random id100": {name: "user100"}
}

你可以在這個TypeScript playground上看到它的運行情況。

Answer 3

擴展@ASDFGerte 評論。 您可以在打字稿 4.5 中生成從 0 到 998 的數字范圍：

type MAXIMUM_ALLOWED_BOUNDARY = 999

type ComputeRange<
  N extends number,
  Result extends Array<unknown> = [],
  > =
  (Result['length'] extends N
    ? Result
    : ComputeRange<N, [...Result, Result['length']]>
  )

// 0 , 1, 2 ... 998
type NumberRange = ComputeRange<MAXIMUM_ALLOWED_BOUNDARY>[number]

type Name<T extends string> = { name: T }

type CustomResponse = {
  [Prop in NumberRange]: Record<`random id${Prop}`, Name<`id${Prop}`>>
}

操場

您可以在此處和此處找到對數字范圍的說明。

您可能已經注意到有一個您無法跨越的限制。

使用上述方法，它將不允許random id1e4 。