【Javascript】 条件分岐2 (if else文) 【プログラミング基礎】

if文では、AでなければBの条件で実行し、AでもBでもなければ別の処理をする、といった処理をよく書きます。つまり条件分岐が連続する場合です。ここではその方法を紹介します。

if文の基本的な内容はこちら

else ifとelse

例えば、Aと満たしていたらaを実行、Aを満たしていなくてBを満たしていたらbを実行、といったものを書けます。

let x = 10;
if (x < 0) {
    console.log("実行されない");
}
else if (x > 5) {
    console.log("実行される");
}
else {
    console.log("手前のelse ifで条件を満たしたので実行されない");
}

新たにelse ifelseが登場しました。

ifの後にelse ifが0個以上続き、elseは最後にのみ配置できます。このルールは, ifが来るたびにリセットされます。else ifelseは、必要がある場合のみ書きます。

else ifは、手前のifelse ifすべてを満たさないときに、条件式を判定した上で実行されます。

elseは、手前のifelse ifすべて条件を満たさなかった場合のみ実行されます。ifelse ifであった条件式の部分は不要です。

英単語のelseは, “その他の”という意味を持ちます. つまり、日本語だとelse ifは”他の条件”、elseはそれ以外全部、という意味になります。

実はelse ifというものがあるというより、elseの中にプログラム的に1行と解釈できるif (...) {...}がある、と見ることができます。

というのも、if文の実行内容は、プログラム的に1行であれば波括弧が不要なためです。

もう少し例を見てみましょう。

let x = 10;
if (x > 0) {
    console.log("xは0より大きいので実行される");
}
else if (x > -10) {
    console.log("xは-10より大きいが、手前のifで条件を満たしたのでここは無視される");
}
else if (1) {
    console.log("1はif文の実行条件を満たすが、手前のifで条件を満たしたので無視される");
}
// elseはなくても良い

// 新しいifが来たので, 手前のif, else if, elseの流れは終了
if (x < 0) {
    console.log("xは0未満ではないので実行されない");
}
else if (x < 5) {
    console.log("xは5未満ではないので実行されない");
}
else if (x < 10) {
    console.log("xは10未満ではないので実行されない (10未満は10を含まない)");
}
else {
    console.log("手前のifとelse ifがすべて実行されなかったので、これが実行される");
}

という流れでプログラムは実行されます。

if elseの整形の仕方にはいくつか流派があり、

if (1) {
    // ...
} else if (1) {
    // ...
} else {

}
if (1) {
    // ...
}
else if (1) {
    // ...
}
else {
    // ...
}
if (1)
{
    // ...
}
else if (1)
{
    // ...
}
else
{
    // ...
}

の3種類が主です。多くは1番目か2番目で、個人の場合は自由で良いです。

チーム開発の場合はコーディング規則に従いましょう。

ifを重ねる

例えば、このような書き方ができます。

let x = 10;
if (x == 10) {
    if (x > 50) {
        console.log("実行されない");
    }
    if (x <= 50) {
        console.log("実行される");
    }
}

これは、x == 10を満たす実行内容が実行されるわけですが、その内容にさらにifが入っています。

つまり, x == 10を満たすと

    if (x != 0) {
        console.log("実行される");
    }
    if (x == 0) {
        console.log("実行されない");
    }

のプログラムが実行されるということです。

実行内容が1行の場合

if文が1行の場合、波括弧を省略できます。

if (x == 0) console.log("xは0");

この1行というのは、エディタ上で1行ではなく、プログラム的に1行ということです。(厳密には異なりますが、とりあえずこの解釈で大丈夫です。)

Javascriptであれば、セミコロンで1行の終わりを示しましたね。

文字列の比較

文字列の比較はこちら

まとめ

if文では、手前の条件を満たしていないときに実行するか判定して実行されるelse ifelseを紹介しました。

この分岐も必ずと行ってよいほど頻繁に使うので、しっかり使い方を把握しましょう。

また、ifを重ねることができます。複雑な条件を作るには、重ねるという行為に慣れる必要があります。まずは簡単な重ね方から初めて、徐々に複雑な条件分岐に慣れていくと良いでしょう。

if else thumb

役に立ったらシェアしよう!