if文を使った条件分岐を理解するコツを分かりやすく解説【プログラミング初心者の入門講座】

2020年2月3日システムJavaScript,プログラム入門

if文を使った条件分岐を理解するコツを分かりやすく解説【プログラミング初心者の入門講座】
if文を使った条件分岐を理解するコツを分かりやすく解説【プログラミング初心者の入門講座】

どうも、UT(@ut_1029)です。

プログラミングの勉強を始めると出会う基礎知識のif文について解説します。

プログラミング歴

この記事を書いている僕は、プログラミング歴10年以上のプログラマーです。
詳細:プログラミング未経験の新卒が10年間プログラマーとして仕事して思うこと

if文の基礎知識

プログラミングのif文について

  • 演算子ってなんだか難しそう
  • 条件分岐がよくわからない
  • else ifとかelseやandやorとか混乱する
  • if分の!(ビックリマーク)ってどういう意味?

と悩むと思います。

if文の条件分岐っていまいち理解できない

プログラミングをはじめたばかりだとif文の条件分岐が難しいです。

if文は理解しやすいコツは「文章や図で解釈する」とシンプルに考えることができます!

では、プログラミングの基礎知識であるif文について簡単に解説します。

if文とは

if文とは、プログラムで条件分岐を行うための演算子です。

演算子とかなんだか難しそう。。。

もっと簡単に表現します。

if文とはプログラミングで「『もし~ならば』と処理を分岐する」ことが出来る演算子です。

if文は「もし~ならば」と条件分岐するときに使う。とだけ覚えておけば大丈夫です。

if文とは

if文は『もし~ならば』とプログラミングで処理を分岐することができる演算子です。

if文を理解するコツ

if文を理解するコツについて紹介します。

文章に置き換えてみる

if文は「もし~ならば」とシンプルに考えましょう。

プログラミングをはじめたばかりだとプログラミングに不慣れでイメージしにくいと思います。

自分もプログラミングをはじめたころはプログラムを難しく考えていました。

でもプログラミングだから難しく考えずに、if文を「文章に置き換えて解釈する」と理解しやすくなります。

なので、if文は「もし~ならば」とシンプルに考えましょう。

図で解釈してみる【フローチャート】

図で解釈してみる【フローチャート】
図で解釈してみる【フローチャート】

もう1つif文を理解するコツとして「図で解釈する」方法があります。

自分もプログラムを理解する際は一度「図にして理解」しています。

図にすることでプログラミングを整理することが出来ます。

なので、if文は「図で解釈する」と整理され理解しやすくなります。

if文を理解するコツ
  • if文は「文章に置き換えて解釈する」と理解しやすくなる
  • if文は「図で解釈する」と理解しやすくなる

if文を使ったプログラミング例

では、実際にif文を使った簡単なJavaScriptのサンプルで解説してみます。

プログラミングは「習うより慣れろ」が重要で、実際にプログラミングすることが近道だったりします。

サンプル:もし~ならば

if文で「もし~ならば」という条件でif文を使った基本サンプルです。「もし国が日本ならば」という条件式です。

var country = 'japan';
var language = '';
if (country == 'japan') {
    language = 'japanese';
}
サンプル:もし~ならば
サンプル:もし~ならば

サンプルの解説

  • 1行目
    • countryという変数にjapanを代入
  • 2行目
    • languageという変数を宣言して初期値の空文字を代入
  • 3行目
    • if文で「もしcountryがjapanならば」という条件式を定義
  • 4行目
    • 3行目で定義したif文の条件に該当する時だけlanguageへjapaneseを代入する

サンプルで理解しておくポイント

  • ifの条件式は、「(」と「)」で囲む
  • ifの条件に該当する場合は、「{」と「}」で囲まれたプログラムが実行される

サンプル:もし~でなければ

サンプルその1を少し変更して「もし~でなければ」という条件のif文の基本サンプルです。「もし国が日本でなければ」という条件式です。

var country = 'japan';
var language = '';
if (country != 'japan') {
    language = 'english';
}
サンプル:もし~でなければ
サンプル:もし~でなければ

サンプルの解説

  • 1行目
    • countryという変数にjapanを代入
  • 2行目
    • languageという変数を宣言して初期値の空文字を代入
  • 3行目
    • if文で「もしcountryがjapanでなければ」という条件式を定義
  • 4行目
    • 3行目で定義したif文の条件に該当する時だけlanguageへenglishを代入する

サンプルで理解しておくポイント

  • ifの条件式で「!=」とすると、「もし~でなければ」という条件になる
if文の基礎知識
  • ifの条件式は、「(」と「)」で囲む
  • ifの条件に該当する場合は、「{」と「}」で囲まれたプログラムが実行される
  • ifの条件式で「==」とすると、「もし~ならば」という条件になる
  • ifの条件式で「!=」とすると、「もし~でなければ」という条件になる

if文のelseやelse if

if文にはelseやelse ifでさらに条件分岐することができます。

さらに条件分岐。。。頭が混乱してくる💦

わかります💦

自分も複雑なプログラムで条件分岐が多いと混乱します💦

if文で混乱した時は「文章で解釈したり図で解釈する」と理解しやすくなります。

if文の実行順序について

if文は基本的に上から順に「if (~) → else if (~) → else」と実行されます。

elseは「もし~ではない」の時に使う

if文のelseで「もし~ではない」という条件の基本サンプルです。「もし国が日本ではない」という条件式です。

var country = 'america';
var language = '';
if (country == 'japan') {
    language = 'japanese';
} else {
    language = 'english';
}
elseは「もし~ではない」の時に使う
elseは「もし~ではない」の時に使う

サンプルの解説

  • 1行目
    • countryという変数にamericaを代入
  • 2行目
    • languageという変数を宣言して初期値の空文字を代入
  • 3行目
    • if文で「もしcountryがjapanでならば」という条件式を定義
  • 4行目
    • 3行目で定義したif文の条件に該当する時だけlanguageへjapaneseを代入する
  • 5行目
    • elseを定義
  • 6行目
    • 3行目のif文の条件に該当しない「もしcountryがjapanではない」時だけlanguageへenglishを代入する

サンプルで理解しておくポイント

  • elseは、ifで定義した条件に該当しない時となる
  • elseは、ifで定義した条件に該当しなかった時に実行したい処理が必要な時に使用する

else ifは「もし~ではなく~ならば」の時に使う

if文のelse ifで「もし~ではなく~ならば」という条件の基本サンプルです。「もし国が日本ではなくアメリカならば」という条件式です。

var country = 'america';
var language = '';
if (country == 'japan') {
    language = 'japanese';
} else if (country == 'america') {
    language = 'english';
}
else ifは「もし~ではなく~ならば」の時に使う
else ifは「もし~ではなく~ならば」の時に使う

サンプルの解説

  • 1行目
    • countryという変数にamericaを代入
  • 2行目
    • languageという変数を宣言して初期値の空文字を代入
  • 3行目
    • if文で「もしcountryがjapanでならば」という条件式を定義
  • 4行目
    • 3行目で定義したif文の条件に該当する時だけlanguageへjapaneseを代入する
  • 5行目
    • else if文で「もしcountryがamaricaならば」という条件式を定義
  • 6行目
    • 3行目のif文の条件に該当しない「もしcountryがjapanではなくamericaならば」の時だけlanguageへenglishを代入する

サンプルで理解しておくポイント

  • else ifは、ifで定義した条件に以外の条件を定義できる
  • else ifは、ifで定義した条件以外に条件がある場合に使用する
elseとelse ifの基本知識
  • else
    • ifで定義した条件に該当しなかった時に実行したい処理が必要な時に使用する
  • else if
    • ifで定義した条件以外に条件がある場合に使用する

まとめ:if文を使った条件分岐を理解するコツを分かりやすく解説

if文はプログラミングにおいて基礎知識ですが、めちゃめちゃ重要です。

ただこの時点でif文がいまいち理解できていなくても「if文はもし~ならば~」と知っていれば問題ありません。

またif文の条件分岐が多くなると混乱してしまいます。

そういったときは「文章や図で解釈する」と理解しやすくなります。

ifの例

ifの例
もし~ならば
if (条件式①) {
// 条件式①に該当する場合
}
elseの例
もし~ではない
if (条件式①) {
// 条件式①に該当する場合
} else {
// 条件式①に該当しない場合
}
else ifの例
もし~ではなく~ならば
if (条件式①) {
// 条件式①に該当する場合
} else if (条件式②) {
// 条件式②に該当する場合
}
ifの例

関係演算子の例

if (a > b)bよりaは大きい
if (a >= b)bよりaは大きいか、等しい
(以上)
if (a < b)bよりaは小さい
if (a <= b)bよりaは小さいか、等しい
(以下)
if (a == b)aとbは等しい
if (a != b)aとbは等しくない
関係演算子の例

論理演算子の例

if (a > 0 && a < 10)0よりaは大きい、かつ10よりaは小さい
if (a == 0 || a == 10)aは0と等しい、またはaは10と等しい
if (!a)でない
論理演算子の例

プログラミング学習について

プログラミングは奥が深くすべてを理解することが難しいです💦

なので、プログラミングの基礎を一通り学習してから理解できていなかった内容を深堀して学習すればいいんです。

プログラミングは「習うより慣れろ」が重要で、実際にプログラミングすることが近道だったりします。

ここまで読んでもらいありがとうございます!

【初心者】ifとは?プログラミング初心者が悩むifについて解説【プログラミング初心者の入門講座】
プログラミング基礎講座

UTの日常では、プログラミングを0から始める方法や基礎知識を解説しています。ぜひ他の記事もご覧ください。

プログラミング未経験から今すぐに始める方法について解説します。なにから始めたらいいのかわかない人は是非ご覧ください。

プログラミング未経験から独学で基礎勉強を始めた人向けに理解するコツやポイントをサンプルコードを使って解説します。

基礎学習ばかりだと勉強に飽きたり身につかなかったりします。プログラミング初心者からステップアップする基礎知識を使ったプログラムのサンプルコードをまとめて紹介します。

UT
UTの日常

1985年生まれ1児の父親です。ブログとか副業で収入を得る手段を模索中であります。(無理しない程度が理想wだから実績が出ないorz)
UTのプロフィール
Amazon欲しいものリスト

2020年2月3日システムJavaScript,プログラム入門

Posted by UT