React とかいろんなところで役に立つ三項演算子

三項演算子とは以下のようなもの

isflag ? console.log("いいよ") : console.log("ダメだよ");

if 文だと

if (isflag) {
  console.log("いいよ");
} else {
  console.log("ダメだよ");
}

何が役に立つの？

三項演算子は、非常にスマートに書ける。
しかし、見にくい

コードが見にくくなってしまう。

という問題があるらしい

js には、アロー関数というのがある。

() => console.log("アロー関数");

map や Object.key などでよく私は、使います。
ここで、if 文を書くとします。

const a = [1, 2, 3, 4, 5];
a.map((data) => {
  if (data == 2) {
    console.log(data);
  }
});

// ====log=====
// 2

2 が表示されます。
こういった書き方よりもこう書いたほうがコードが見やすいと思います。

a.map((data) => (data == 2 ? console.log(data) : null));

コードは書いていると、長くなります。
長いコードをスクロールするのも大変だと思っています。

条件式をしたとしても表示するかしないか、出力するかどうか
などで数行分書くのは、大変です。

React などでは、状態によって表示するかどうかを決める時があります。そういったとき IF 文なのか三項演算子なのかは、好みによります。

私は、単純な処理なら三項演算子を使います。
好みです！！