ウェブサイト検索

TypeScript - 動的なキーを持つオブジェクトのインターフェースをどのように定義するか？

私は、Underscoreの_.groupBy()メソッドによって作成されたこのようなオブジェクトを持っています。

myObject = {
  "key" : [{Object},{Object2},{Object3}],
  "key2" : [{Object4},{Object5},{Object6}],
  ...
}

TypeScriptでそれをインターフェースとしてどのように定義しますか？単にmyObject:Object={ ...のように定義するのではなく、それ専用の型を持たせたいです。

回答 #1

あなたのオブジェクトは、Object 配列の辞書のように見えます

interface Dic {
    [key: string]: Object[]
}

TypeScript の文献では、このパターンを一般的な形式で「インデックス可能なオブジェクトの記述」と呼ぶことがよくあります

interface Dic {
    [key: string|number]: object_type
}

または

type Dic = {
    [key: string|number]: object_type
}

回答 #2

TypeScriptには現在、専用のRecord型があります:

const myObject: Record<string, object[]> = { ... }

また、可能なときはキーを打つことを考慮してください:

type MyKey = 'key1' | 'key2' | ...

const myObject: Record<MyKey, object[]> = { ... }

回答 #3

{ [x: string]: T }

そして

Record<string, T>

通常はすべての目的に対応します。しかし、ある時点で奇妙な状況に遭遇しました。あるタイプの操作の後、最初のオプションが[x: string]と[x: number]の両方を返してきて、Recordを使用できなくなったのです。それは再帰的なタイプ操作であり、TypeScriptが私の再帰型がジェネリックではないとエラーを投げていました。

それで、本当に小さなRecordコードを勉強して、私の複雑な問題を解決したこの解決策にたどり着きました:

{ [P in string]: T }

編集: 私は通常、書くすべてのTypeScriptコードで、utils.tsファイルにこれを入れています:

export type obj<T = unknown> = Record<string, T>

常に「記録」を使うよりも速く、きれいです。

例：

type MyObjectType = {
  propA: obj; // An object with unknown props
  propB: obj<number>; // An object with number props
}

関連記事