【TypeScript】【LookUp型（インデックスアクセス型）】について

はじめに

この記事は【LookUp型（インデックスアクセス型）】についての備忘録である。

【LookUp型（インデックスアクセス型）】とは

• 型から特定のプロパティの型を抽出する機能
• 型の再利用性や柔軟性が向上する

インデックスアクセス型の基本構文と使用方法

インデックスアクセス型の概要

• インデックスアクセス型は、オブジェクト型のプロパティの型を取得するために使用する。基本的な構文は以下の通りである。

// サンプルコード
type Person = {
    name: string;
    age: number;
};

type NameType = Person["name"]; // NameTypeはstring型になる
type AgeType = Person["age"];   // AgeTypeはnumber型になる

配列への利用

• 配列の場合、キーとして[number]を指定することで、要素を取り出せる

type Hoge = Array<string>;
type A = Hoge[number]; //型はstring

type Foo = string[];
type B = Foo[number]; //型はstring

type Bar = (string | boolean)[];
type C = Bar[number]; // 型はstring | boolean

keyofとの共存

• オブジェクトの各プロパティに対するvalueの型をユニオン型で取得できる
• ジェネリクスを用いて、型を関数のように扱うことが可能

interface Person {
  name: string;
  age: number;
}
type A = Person[keyof Person];
//型はstring | number

interface Person {
  name: string;
  age: number;
}

type ValueOfType<T, U extends keyof T> = T[U];
type Typeofname = ValueOfType<Person, "name">;
//型はstring