型エイリアス｜コードで実践

型に名前を付ける

同じ形を何度も書くのは面倒です。type を使うと、型そのものに名前を付けて使い回せます。これを型エイリアスと呼びます。エイリアスとは別名のことです。

type Profile = {
  name: string;
  workCount: number;
  isPublic: boolean;
};

function headline(profile: Profile): string {
  return profile.name + "（" + profile.workCount + "件）";
}

名前は大文字で始めるのが慣習です。変数と見分けやすくなります。

オブジェクト以外にも付けられる

型エイリアスはオブジェクトの形だけのものではありません。どんな型にも名前を付けられます。

type UserName = string;
type WorkTitles = string[];
type Nickname = string | null;

UserName の中身はただの string ですが、名前が付くだけで読み手に意図が伝わります。string | null のような長い型ほど、名前を付けた効果が大きくなります。

名前を組み合わせられる

作った名前は、別の型の中でそのまま部品として使えます。

type Nickname = string | null;

type Profile = {
  name: string;
  nickname: Nickname;
  titles: string[];
};

データの形が変わったとき、直すのは type を書いた 1 か所だけになります。同じ形を 10 か所に書き写していたら、10 か所すべてを直すことになっていました。

型は実行時には残らない

type で書いたものは、コンパイルすると跡形もなく消えます。変数のように値が入っているわけではないので、実行中に Profile を呼び出したりはできません。

type Profile = { name: string };
console.log(Profile); // エラー 'Profile' only refers to a type.

型は書いている最中にだけ働く道具だ、と考えてください。

手を動かす

演習では、プロフィールのデータを受け取って一行の紹介文を返す関数を仕上げます。引数の型を直接書かずに、type で名前を付けてから使ってください。ニックネームの型にも名前を付けると、読みやすさの違いが分かります。

型エイリアス