三項演算子をシンプルにする

可読性

三項演算子を複雑に使用すると、条件の構造が明確に見えなくなり、コードが読みづらくなることがあります。

📝 コード例

次のコードは、A条件とB条件に応じて、BOTH、A、またはNONEのいずれかをstatusに指定するコードです。

const status =
  A条件 && B条件 ? "BOTH" : どちらも違う場合 ? "NONE" : A条件 ? "A" : undefined;

👃 コードの不吉な臭いを嗅いでみる

可読性

このコードは複数の三項演算子がネストされて使用されているため、正確にどの条件で値が計算されているのかを一目で把握するのが難しいです。

✏️ リファクタリングしてみる

次のように条件をif文で展開すると、より明確で簡潔に条件を示すことができます。

const status = (() => {
  if (A条件 && B条件) {
    return "BOTH";
  }

  if (A条件) {
    return "A条件";
  }

  return "NONE";
})();