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 文なのか三項演算子なのかは、好みによります。
私は、単純な処理なら三項演算子を使います。
好みです!!