TypeScript マッピング型の詳細

1. マップされた型

場合によっては、ある型を別の型に基づいて作成する必要があるものの、コピーを作成したくないことがあります。この場合は、マッピング型の使用を検討できます。

マッピングタイプは、インデックスシグネチャの構文に基づいています。まずはインデックスシグネチャを確認しましょう。

// プロパティの型を事前に宣言する必要がある場合 type OnlyBoolsAndHorses = {
  [キー: 文字列]: ブール値 | 馬;
};
 
const準拠: OnlyBoolsAndHorses = {
  del: 本当、
  ロドニー: 間違いだ、
};

マッピングタイプは、 PropertyKeysユニオンタイプを使用するジェネリックタイプです。PropertyKeys PropertyKeys通常、 keyofを通じて作成され、キー名をループしてタイプを作成します。

タイプ OptionsFlags<Type> = {
  [keyof Type のプロパティ]: boolean;
};

この例では、 OptionsFlags Type のすべてのプロパティを反復処理し、それらをブール型に設定します。

タイプFeatureFlags = {
  ダークモード: () => void;
  新しいユーザープロファイル: () => void;
};
 
タイプ FeatureOptions = OptionsFlags<FeatureFlags>;
// タイプFeatureOptions = {
// darkMode: ブール値;
// 新しいユーザープロファイル: ブール値;
// }

2. マッピング修飾子

マップされた型を使用する場合、使用できる追加の修飾子が 2 つあります。1 つはプロパティを読み取り専用に設定するために使用される readonly で、もう 1 つはプロパティをオプションに設定するために使用される ? です。

これらの修飾子は、プレフィックスに - または + を付けることで削除または追加できます。プレフィックスを指定しない場合は、プレフィックス + を使用するのと同じです。

// 属性内の読み取り専用属性タイプを削除します CreateMutable<Type> = {
  -readonly [keyof Type 内のプロパティ]: Type[プロパティ];
};
 
タイプ LockedAccount = {
  読み取り専用ID: 文字列;
  読み取り専用の名前: 文字列;
};
 
UnlockedAccount を CreateMutable<LockedAccount> と入力します。

// タイプ UnlockedAccount = {
// id: 文字列;
// 名前: 文字列;
// }
// 属性内のオプション属性タイプを削除します。Concrete<Type> = {
  [Typeのキー内のプロパティ]-?: Type[プロパティ];
};
 
MaybeUser = {と入力します
  id: 文字列;
  名前?: 文字列;
  年齢?: 番号;
};
 
User を Concrete<MaybeUser> と入力します。
// タイプ User = {
// id: 文字列;
// 名前: 文字列;
//年齢: 数値;
// }

3. キーの再マッピング

TypeScript 4.1以降では、as ステートメントを使用して、マップされた型のキーを再マップできます。

タイプ MappedTypeWithNewProperties<Type> = {
    [keyof Type の NewKeyType としてのプロパティ]: Type[プロパティ]
}

たとえば、テンプレートリテラル型を使用して、以前のプロパティ名に基づいて新しいプロパティ名を作成できます。

タイプ Getters<Type> = {
    [keyof Type のプロパティは `get${Capitalize<string & Property>}` です]: () => Type[Property]
};
 
インターフェース Person {
    名前: 文字列;
    年齢: 番号;
    場所: 文字列;
}
 
LazyPerson = Getters<Person> と入力します。

// タイプ LazyPerson = {
// getName: () => 文字列;
// getAge: () => 数値;
// getLocation: () => 文字列;
// }

条件型を使用して never を返し、特定の属性を除外することもできます。

// 'kind'プロパティを削除します
タイプ RemoveKindField<Type> = {
    [キーの Type のプロパティが Exclude<Property, "kind"> である]: Type[Property]
};
 
インターフェースサークル{
    種類: "circle";
    半径: 数値;
}
 
タイプ KindlessCircle = RemoveKindField<Circle>;

// タイプ KindlessCircle = {
// 半径: 数値;
// }

また、 string | number | symbolだけでなく、任意のタイプのユニオンを反復処理することもできます。

型 EventConfig<Events extends { kind: string }> = {
    [E in Events を E["kind"]] として: (イベント: E) => void;
}
 
タイプ SquareEvent = { kind: "square", x: 数値, y: 数値 };
タイプ CircleEvent = { kind: "circle", 半径: 数値 };
 
タイプ Config = EventConfig<SquareEvent | CircleEvent>
// タイプ Config = {
// square: (イベント: SquareEvent) => void;
// 円: (イベント: CircleEvent) => void;
// }

4. さらなる調査

マッピングタイプは他の関数でも使用できます。たとえば、これは条件付きタイプを使用し、オブジェクトに pii 属性があるかどうかに応じて true または false を返すマッピングタイプです。

タイプExtractPII<Type> = {
  [keyof Type のプロパティ]: Type[プロパティ] は { pii: true } を拡張します。true : false;
};
 
タイプ DBFields = {
  id: { 形式: "増加中" };
  名前: { タイプ: 文字列; pii: true };
};
 
ObjectsNeedingGDPRDeletion を ExtractPII<DBFields> と入力します。
// type ObjectsNeedingGDPRDeletion = {
// id: false;
// 名前: true;
// }

以下もご興味があるかもしれません: