Tìm kiếm trang web

javascript - Typescript: cách định nghĩa một đối tượng với nhiều khóa không xác định


Tôi đang xây dựng một ứng dụng truy cập vào một API trả về một đối tượng với nhiều khóa không xác định, mỗi khóa đại diện cho một ID của người dùng.

Ví dụ :

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

Tôi biết rằng nếu tôi chỉ có một khóa chưa biết, tôi có thể định nghĩa bằng cách sử dụng cái gì đó như:

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

Nhưng làm sao tôi có thể định nghĩa một đối tượng với nhiều khóa khác nhau như vậy?

Câu trả lời #1

[key: string] cho phép bất kỳ số lượng chuỗi duy nhất nào làm khóa.

type Metadata = {
  name: string
}

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

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

Thử nó trên TypeScript Playground

Câu trả lời #2

Mở rộng bình luận của @ASDFGerte. Bạn có thể tạo một dãy số từ 0 đến 998 trong TypeScript 4.5:

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}`>>
}


Sân chơi

Tại đây và tại đây bạn có thể tìm thấy một giải thích về phạm vi số.

Bạn có lẽ đã để ý rằng có một giới hạn mà bạn không thể vượt qua.

Với cách tiếp cận trên, nó sẽ không cho phép random id1e4.

Bài viết liên quan