「satisfies」とTypeScriptの基本

はじめに

この記事では、「satisfies」演算子の簡単な使い方と、いつ使うべきかを説明します。

「satisfies」演算子って何？

「satisfies」演算子は、ある型が特定の条件やインターフェースを満たすかどうかをチェックするものです。これにより、変数が指定された型やインターフェースの定義に沿っているかどうかを確認できます。

なぜ便利なの？

例えば、2つの異なる値を持つ型を定義した場合、そのどちらが実際に使われているか分からないことがあります。「satisfies」演算子を使うと、特定の値の実際の型をより正確に把握できます。

例

type allMyInfo = personalInfo | workInfo;

allMyInfoは、personalInfoかworkInfoのどちらかになります。

type personalInfo = "田中" | "佐藤" | "小林";
type workInfo = {
  id: number;
  bossAge: number;
};

次に、allMyInfoを使うPerson型を定義します。これには2つの値があり、それぞれがallMyInfoを持っています。

type Person = {
  myInfo: allMyInfo;
  myOtherInfo: allMyInfo;
};

const applicant: Person = {
  myInfo: "田中",
  myOtherInfo: { id: 123, bossAge: 28 },
};

この状態で、toUpperCaseメソッドを呼び出そうとすると、次のようなエラーが表示されます。

applicant.myInfo.toUpperCase();
// Error: プロパティ toUpperCase は型 allMyInfo に存在しません

これは、TypeScriptがmyInfoやmyOtherInfoの値の型を確定できないために発生します。

このエラーを修正するために、if文を使ってmyInfoが文字列型かどうかを確認し、その中でtoUpperCaseメソッドを使うことができます。
でも、ここで「satisfies」演算子が登場します。

const applicant = {
  myInfo: "田中",
  myOtherInfo: { id: 123, age: 22 },
} satisfies Person;

Person型の後にsatisfiesを追加することで、TypeScriptはどの値を選ぶべきかを推論し、toUpperCaseメソッドを使えるようにしてくれます。