【JavaScript入門】If文を使って条件分岐する方法

公開日：2016-6-4 最終更新日：2017-2-8
プロナビTOP / プログラミング初心者向け技術系ノウハウ・まとめ

JavaScriptのif文とは？

まずこれからプログラミングを始める方もいるかもしれないので「if文」についておさらいをしておきましょう。if文というのは物凄く簡単に説明すると「条件を分ける処理」のことをいいます。別の言い方だと条件分岐といいます。また、英語でifというのは「もし〜」ということなので、英語で考えるとプログラミングは理解しやすいかもしれません。

条件分岐というと難しく聞こえるかもしれないので一つの例を出します。

Aの場合はこの処理をする。

Bの場合はこの処理をする。

それ以外の場合はこの処理をする。

というような形で条件を決めて自分の行いたい命令をプログラミングすることが出来るものです。JavaScriptだけでなく「全てのプログラム言語」共通でif文が存在するということも理解しておきましょう。

実際にif文を使ってみよう

では簡単な説明を済ませた所で具体的に条件分岐「if文」について詳しく見ていきましょう。JavaScriptでは必ず<script></script>の記述するルールなのでそれも忘れずにしておきましょう。

記述の仕方はこの通りです

if (条件) {
条件が正しければ処理が実行される　※別の言い方で条件が「真であれば」と表現する。
}

参考例は「テストの点数」についてです。

<script>
var tensuu = 80;
if (tensuu >= 70) {
	document.write(“70点よりも点数が良いのであなたはすごいです！”);
} 

</script>

var tensuu = 80;

if (tensuu >= 70) {

document.write(“70点よりも点数が良いのであなたはすごいです！”);

}

</script>

If…else 文を使ってみよう

今度は応用のテクニックです。とはいっても慣れれば複雑な処理も簡単に行うことが出来るので慣れておくようにしましょう。

記述の仕方はこの通りです

if (条件) {
条件が正しければ処理が実行される
} else {
それ以外の場合の処理が実行される
}

<script>
var tensuu = 80;
if (tensuu >= 70) {
	document.write(“70点よりも点数が良いのであなたはすごいです！”);
} else {
	document.write(“あなたは70点以下なのでもう少し頑張りましょう！”);
}

</script>

var tensuu = 80;

if (tensuu >= 70) {

document.write(“70点よりも点数が良いのであなたはすごいです！”);

} else {

document.write(“あなたは70点以下なのでもう少し頑張りましょう！”);

}

</script>

このように、「else」を使うことでそれ以外の条件も付け加えることが出来ます。

プログラミングの基本として「if文」はとても重要になってきますし、どのプログラミング言語に触れても必ず使います。また、私たちが物事を判断するときは必ず「条件分岐」を行っています。つまり、プログラミングとして難しく考えてしまうかもしれませんが、自分たちの生活に置き換えればさほど特別なことをしているということではありません。最初のうちは条件分岐をはじめとしたプログラミングの流れが難しく感じるかもしれませんが、毎日触れることで必ず使いこなせるようになります。

プログラミングは最初はとにかく動かすことが肝心

今回はif文について解説しましたが、コードを柔軟に書いていくにはある程度の歳月が必要です。初心者の方の中には、最初からコードを綺麗に書こうとしたり、複雑なプログラムを作ろうと考えてしまう方も少なくありません。それは良いことでもありますが、いきなり挫折してしまう可能性もあるため、あまりオススメはできません。

プログラミングを始めたころは「プログラムが動くことの楽しさ」を感じることができれば問題ありません。また、初心者の方にとってはある程度複雑なシステムを作らない限りは、綺麗に書いても書いていなくてもさほどの違いはありません（※厳密にはありますがほとんど気にならないということ）最初はプログラミングを楽しく、自由に書いていくことが上達するポイントです。

投稿者：プロナビ編集部