TypeScriptでユニオン型というか共用体型で特定のプロパティがあるかなしかで云々みたいなことをしたいとき的なお話

APiとか叩いたときに、正常異常で型が違うときってあるよね的な。
そういうときってそもそもどうやって型を定義するかとかもあるんだけど、気持ち的にはユニオン型にしておくとなんとなく気持ちいい感じであったり。
そうしたときに単純にプロパティの比較をやろうとするとコンパイルできなかったりしたり。
ということで今日はそれをちゃんとできるようにするには的なお話をば。

type OK = {
  result: string,
}

type NG = {
  error: boolean,
  message: string,
}

const Hoge = (): OK | NG => ({
  result: 'ok',
});

const hoge = Hoge();

// これは失敗する
// if (hoge.error) {
//   console.log(hoge.message);
// } else {
//   console.log(hoge.result);
// }

if ('error' in hoge) {
  // ここではhogeがNG型として扱われる
  console.log(hoge.message);
} else {
  // ここではhogeがOK型として扱われる
  console.log(hoge.result);
}

// ここではhogeがOK | NG型として扱われる
console.log(hoge);

とりあえずこんな感じ。
jsでよくやっていたプロパティがあるかないかでチェックをするとOK | NG型に対してerrorというプロパティがあるかチェックをすることになる。
そうするとOK型にはerrorというプロパティがないからここでエラーが出てしまうという。

なので'error' in hogeという形でinを使ってあげるとそのif文の中ではNG型として扱われるので大丈夫という仕組み的な。
もちろんそこから外れるとOK | NG型として扱われるので要注意的な。

ってな感じでユニオン型で出てきた結果を比較したい的な感じのときにはin使ってやってあげると良い的なみたいな。