【Typescript】ユーザー定義型ガードisについて

isとは

型推論を補強するもので、型の絞り込みをすることができる関数です。

isを使用しないパターンと使用するパターンの例を出して、isの便利さを説明できればと思います。

isを使用しないパターン

type Hoge = string | number;
const isNumber = (arg: Hoge): boolean => {
  return typeof arg === "number";
};

const baigaeshi = (arg: Hoge) => {
  if (isNumber(arg)) {
    console.log(arg * 2);
    // -------- ~~~ エラー
    // number型だと分かりきってはいるが、コンパイラはあくまで
    // Hoge型と推論しているので、stringかnumberかどちらかわからずエラーとなる
  }
};
baigaeshi(10);

isを使用するパターン

type Hoge = string | number;
const isNumber = (arg: Hoge): arg is number => {
// isを使うことで、返り値がtrueの場合、
// 返り値はnumber型であると、コンパイラに教えることができる。
  return typeof arg === "number";
};

const baigaeshi = (arg: Hoge) => {
  if (isNumber(arg)) {
    console.log(arg * 2);
    //コンパイラはnumber型であると教えてもらっているので、エラーとならない。
  } else {
    console.log(Number(arg) * 2)
  }
};
baigaeshi(5);
//[LOG]: 10 

参考