みなさんこんにちは、現役エンジニアのサメハックです
アパレル企業でトップ販売員を経て
未経験からWebエンジニアに転職し、
現在正社員として5年働いています!
今回は条件分岐について学んでいきましょう!
駆け出しエンジニアや未経験の方、
また新入社員を指導する先輩社員にとっても
わかりやすいように解説していきます!
- 条件分岐を理解できる
- if文が書けるようになる
- if~else文が書けるようになる
条件分岐とは

条件分岐とは、もし〇〇ならXXせよ。
というように、条件に応じて処理を分岐させることです。
たとえばですが、テストの点が
・70点以上だったら、進級する
・70点未満だったら、補修を受ける
信号が、
・青なら進む
・黄色なら注意
・赤なら止まる
このような条件と、現在の状況を比較して
条件を満たす(true)か満たさない(false)かで処理を分けることです。
if文
条件分岐の基本はif文です。
ifという英単語の意味は「もしも」です
つまり“もし〇〇なら”の部分を表します。
構文
if (条件式) {
// 条件式がtrueだった場合の処理
}
このように記述します。
例えばですが、テストの結果(score)が
70点以上だったら”合格です”
と出力する条件分岐を作ってみましょう。
if (score >= 70) {
console.log("合格です");
}
こんな感じに記述することが出来ます!
※比較演算子について復習したい方はこちら

falseの場合は何もしないよ!
if〜else文
if~else文とは、「もし〇〇ならXXせよ、〇〇でなければ△△せよ」という文で
条件式がfalseの場合の処理も指定されている条件分岐です。
構文
if (条件式) {
// 条件式がtrueだった場合の処理
} else {
// 条件式がfalseだった場合の処理
}
このように記述します。
先ほどのテストの例で、
テストの結果(score)が70点以上だったら「合格です」
テストの結果(score)が70点未満だったら「不合格です」
と出力する条件分岐を作ってみましょう。
if (score >= 70) {
console.log("合格です");
} else {
console.log("不合格です");
}
※elseのあとに条件式は不要です
こんな感じに記述することが出来ます!
if ~ else if ~ else文
if ~ else if ~ else文とは、「もし〇〇ならXXせよ、□□なら☆☆せよ、何れにも該当しなければ△△せよ」
という文で、指定された条件とその処理が複数ある場合の書き方です。
構文
if (条件式1) {
// 条件式1がtrueだった場合の処理
} else if (条件式2){
// 条件式2がtrueだった場合の処理
}
} else {
// 条件式1,2 両方falseだった場合の処理
}
同じくテストの例で、
テストの結果(score)が100点だったら「満点です」
テストの結果(score)が70点以上だったら「合格です」
テストの結果(score)が70点未満だったら「不合格です」
と出力する条件分岐を作ってみましょう。
if (score == 100) {
console.log("満点です");
} else if (score >= 70) {
console.log("合格です");
} else {
console.log("不合格です");
}
このように記述することが出来ます!
オマケ:問題

hourという定数を宣言し、0〜23の値入れてください
hourの値に応じて以下のように、出力を変えてください。
①hourが0の場合は「今はhour時だよ!日付が変わったよ!」
②20以上の場合は「今はhour時だよ!こんばんは!」
③7以上の場合は「今はhour時だよ!こんにちは!」
③それ以外場合は「今はhour時だよ!まだ寝てるよ!」

※オンラインで実行したい方はこちらを参考に
まとめ
- 条件分岐とは「もし〇〇ならXXせよ」というように処理を分岐させること
- if文は、条件式がtrueの場合のみに特定の処理を実行
- if ~ else文は、条件式がtrueの場合にもfalseの場合にも何かしらの処理を実行
- if ~ else if ~ else文は、条件式が複数ある場合の書き方
プログラミングの8割は条件分岐で出来ているので、何度も復習しようね!
オマケ:答え
解答例①
// 現在時刻の宣言
const hour = 0;
if (hour == 0) {
// 0時の場合の処理
console.log("今は" + hour + "時だよ!日付が変わったよ!");
} else if (hour >= 20) {
// 20時以上だった場合の処理
console.log("今は" + hour + "時だよ!こんばんは!");
} else if (hour >= 7) {
// 7時以上だった場合の処理
console.log("今は" + hour + "時だよ!こんにちは!");
} else {
// 何れにも該当しなかった場合(1〜6時)の場合の処理
console.log("今は" + hour + "時だよ!まだ寝てるよ!");
}
解答例②
※AND条件が書ける方向け
// 現在時刻の宣言
const hour = 0;
if (hour == 0) {
// 0時の場合の処理
console.log("今は" + hour + "時だよ!日付が変わったよ!");
} else if (20 <= hour && hour <= 23) {
// 20時~23時だった場合の処理
console.log("今は" + hour + "時だよ!こんばんは!");
} else if (7 <= hour && hour <= 19) {
// 7時〜19時以上だった場合の処理
console.log("今は" + hour + "時だよ!こんにちは!");
} else {
// 何れにも該当しなかった場合(1〜6時)の場合の処理
console.log("今は" + hour + "時だよ!まだ寝てるよ!");
}
今回は①のパターンで書けていればOKです!
②のパターンについては、近々解説します。

満足いただけたら、1クリックなのでSNSフォローしてもらえると嬉しいです🦈
サメハック。