三項演算子

Last updated at 2024-01-30Posted at 2024-01-30

はじめに

新入社員教育でウェブ開発について学習しています。
今回はWEBページ作成中に混乱した、
演算子の種類や三項演算子についてまとめました。

演算子とは

「1つ以上の値」から、（計算などの操作をして）「別の値」を生み出すもの

四則演算をする際に使用する+（足す） -（引く） *（掛ける） /（割る）などが演算子にあたります。

$num = 4 + 7

+と=を使って、4・7という1つ以上の値を受け取り、11という別の値を生み出しています。

オペレーター・オペランド

演算子をオペレーター、演算の対象となる値や変数のことをオペランドという

$num = 4 + 7  //+,=はオペレーター、4,7,$numはオペランド
const hoge = 10  //=はオペレーター、hoge,10はオペランド

詳しくいうと、最初の式は
オペレーターである代数演算子「+」のオペランドが、4 と 7 で、
オペレーターである代入演算子「=」のオペランドが、変数 numと、部分式 4 + 7 です。

三項演算子とは

if文の省略形または代替手段として利用することが可能
3つのオペランドを必要とする演算子

1. `if`文の省略形または代替手段

if文とは

IF文は「条件式」の結果に応じて、「True」「False」の処理を振り分けることができる構文です。

if(条件式) {
    //Trueの処理
} else {
    //Falseの処理
}

これを「条件（三項）演算子」で記述すると、

条件式 ? Trueの処理 : Falseの処理

となり、シンプルにすることができます。

使ってみる

if文

if(5 > 2) {
    console.log( true );
} else {
    console.log( false );
}

三項演算子

console.log( 5 > 2 ? true : false );

このサンプルでは条件式が「5 > 2」となっており、正しい条件なのでtrueの処理が実行されて最終的には「true」が表示されているのが分かります。

最終的な結果を「戻り値」として変数に代入してみると

const result = 5 > 2 ? true : false;
console.log( result );

変数「result」へ条件式の結果を代入して出力しているのが分かります。