JavaScript　超入門(6) 制御構文　分岐

inoue

Javascriptを学んでみようという人をターゲットに、JavaScriptの基本を解説していきたいと思います。

他の言語（特にJava等のオブジェクト指向言語）は少しでもかじったことがあるけど、JavaScriptはまだ･･･って人を想定しています。

制御構文

ごく基本的なことなので確認になりますが、プログラムは次の三つの構造を基本としています。

順次：上から下に記述された順で処理を行なう
分岐：条件によって異なる処理を行なう
反復：条件が満たされている間処理を繰り返し行なう

これらを組み合わせて流れを制御します。

分岐と反復の記述について言語的に構文が用意されているので確認しておきましょう。
JavaScriptの制御構文はCやJavaに酷似しており、他のプログラミング言語経験があれば特に難しいところはないはずです。

分岐

if文

条件式（論理値を返す式）の評価を行い、値によって処理を分岐させるのがif文です。
構文は次のようになります。

if (条件式) {
  trueのときの処理
} else {
  falseのときの処理
}

var num = 1;
if (num >= 0) {
  document.body.innerHTML = 'numは0または正の数です';
} else {
  document.body.innerHTML = 'numは負の数です';
}

条件が複数のときはelse ifを用います。

var num = 1;
if (num > 0) {
  document.body.innerHTML = 'numは正の数です';
} else if (num === 0) {
  document.body.innerHTML = 'numは0です';
} else {
  document.body.innerHTML = 'numは負の数です';
}

なおif文は処理が1行で済むときは次のように{}を構文上省略できます。

var num = -1;
if (num > 0) document.body.innerHTML = 'numは正の数です';
else if (num === 0) document.body.innerHTML = 'numは0です';
else document.body.innerHTML = 'numは負の数です';

とはいえ、ミスを生む、読みづらいと思う人もいるので面倒でも{}を書くことをオススメします。

switch文

ある値を他の値と等しいか比較しての分岐はif文だと冗長になることがあります。
そういう場合はswitch文を用います。構文は次のようになります。

switch (条件式) {
  case 値A:
    値Aに等しいとき行なう処理A
    break;
  case 値B:
    値Bに等しいとき行なう処理B
    break;
  .
  .
  default:
    どのcaseにも該当しないとき行なう処理
}

var num = 1;
switch (num) {
    case 0:
      document.body.innerHTML = 'numは0です';
      break;
    case 1:
      document.body.innerHTML = 'numは1です';
      break;
    default:
      document.body.innerHTML = 'numは0と1以外です';
}

与えられた値によって処理を分岐させることができます。
上から順に判別していき、caseに一致する場合ブロックの処理が実行されbreakでswtichブロックを抜けます。
上のcase全てに当てはまらなかった場合defaultのブロックが実行されます。

ここでのポイントはbreakです。break文がなくても動作はしますが、意図した挙動になりません。
例えば次のコードを見てみましょう。

var num = 0;
switch (num) {
    case 0:
      document.body.innerHTML += 'numは0です';
    case 1:
      document.body.innerHTML += 'numは1です';
    default:
      document.body.innerHTML += 'numは0と1以外です';
}

この場合、numは0です・numは1です・numは0と1以外ですの全てが表示されます。
このようにbreakを記述すると複数のブロックの処理が実行されることをフォールスルーと言います。
意図的にフォールスルーにすることもできますが、これも読みづらくなるのでオススメしません。

以上、分岐の構文、if文とswitch文について解説しました。
次回反復（繰り返し）の記述にして紹介します。