【JavaScript超入門】if文をマスターしよう

今回は、JavaScriptのif文についてマスターしていきましょう。

条件式に使用する演算子については、こちらの記事を参考にしてください＾＾

【JavaScript超入門】演算子の使い方まとめ今回は、JavaScriptの演算子について学習していきましょう。 演算子とは、＋やーを使った基本的な計算や、比較の時に使用する＝...

if文の基本

if文の基本はサンプルコードを見た方が早いでしょう。

let num = 3;
if(num % 3 === 0) {
    console.log('3で割り切れる数');
} else if(num % 7 === 0) {
    console.log('7で割り切れる数');
} else {
    console.log('それ以外');
}

if文は（ ）の中に条件式を書き、{ }　の中に条件に当てはまった場合の処理を書きます。

また、else if、else で条件を分岐させることができます。

else if は「または」、else は「それ以外なら」という条件分岐になります。

上のサンプルコードは、「もし3で割り切れる数なら」、「または7で割り切れる数なら」、「それ以外なら」という条件になりますね＾＾

 

if文の中にif文を書くことも可能

if文の中に、if文を書くこともできます。

if(num % 3 === 0) {
    if(num % 7 === 0) {
        console.log('3かつ7で割り切れる数');
    }
}

ただしif文の中にif文を書くほど、可読性は悪くなると言われているので

if文をネストさせるときは注意してください。

中括弧 { } は省略可能

中括弧は省略することもできます。

if($num % 3 === 0)
    console.log('3で割り切れる数');
else 
    console.log('それ以外');

ただし、このように中括弧を省略する書き方は、どこからどこまでがif文なのか分かりにくくく、バグにも繋がりやすいので、使用されるときはご注意ください。

三項演算子

シンプルな条件分岐なのであれば、三項演算子を使用すればスマートに実装することができます。

if(num % 2 === 0) {
    console.log('偶数');
} else {
    console.log('奇数');
}

このようなif – else で分岐するような条件があった場合、三項演算子を使用すると

num % 2 === 0 ? console.log('偶数') : console.log('奇数');

このように１行で書くことができます。

初学者の場合は、まずは丁寧にif文で条件分岐してあげればよろしいかと思いますが、ある程度、経験を積まれている型であれば、シンプルな条件分岐の処理は三項演算子を積極的に使用されると、より可読性が良いコードになるかなと思います。

switch文

switch文も一緒におさえておきましょう

let country = 'Japan';

switch(country) {
    case 'Japan':
        console.log('日本');
        break;
    case 'America':
        console.log('アメリカ');
        break;
    default:
        console.log('それ以外');
        break;
}

用途はif文と同じになります。

基本はif文で問題ないと思いますが、if- else if の条件分岐が多岐に渡る場合は、switch文で書いた方が読みやすいケースもあります。

switch もif文を合わせて、マスターしてみてください＾＾