while文

広告

主に指定した回数だけ繰り返し目的で利用されるfor文に対して、条件が満たされている間は何度でも繰り返す目的で利用されるのがwhile文です。書式は次の通りです。

while (条件式)
  実行する文;
while (条件式){
  実行する文1;
  実行する文2;
  ...
}

while文は条件式を一度評価します。評価した結果としてtrueが返された場合にはwhile文の次の文を実行します。ブロックを使用することで複数の文を実行することも可能です(ブロックを使う場合は「{」から「}」の間に実行したい文を記述します)。ここまでが1回目の繰り返し処理となります。そして再度先頭に戻り改めて条件式を評価します。評価した結果がtrueなら再度次の文を実行し、falseだった場合にはwhile文を終了します。

while文はfor文と似ていますが初期化式や変化式がありません。その為、少なくとも繰り返しの中で実行される文を使い条件を変化させるような処理を行う必要があります。

var i = 0;

while (i < 2){
  alert("i = " + i);
  i++;    // この文が無いと無限ループになってしまう。
}

for文は決まった回数だけ繰り返す場合に使われることが多いのですが、while文では繰り返し回数が決まっていない場合などに使われることが多いです。例えばファイルを読み込み最後の行まで順に1行ずつ処理するような場合です。この場合はファイルに含まれる行数によって何回繰り返されるのかが決まりますのでfor文よりはwhile文の方が向いているかもしれません。ただこれはあくまで目安であってfor文であってもwhile文であってもどのような処理に対してどちらを使用しても構いません。

処理の流れ

では簡単な例を使い処理の流れを確認してみます。

var i = 0;

while (i < 2){
  alert("i = " + i);
  i++;
}

この場合は次のような処理の流れとなります。

 1)変数「i」を宣言し初期値の「0」を代入

 2)条件式を評価。iは2よりも小さいので繰り返しを実行
 3)「i = 0」を画面に出力
 4)i++;

 5)条件式を評価。iは2よりも小さいので繰り返しを実行
 6)「i = 1」を画面に出力
 7)i++;

 8)条件式を評価。iは2よりも小さくないので繰り返しを終了

for文と同じくwhile文ではまず最初に条件式が評価されます。もしも条件式がいきなりfalseとなった場合には繰り返し処理は実行されません。条件式がtrueだった場合にはwhile文の次の文を実行します。ブロックが使われている場合は「{」から「}」までのブロック内の文を順に実行していきます。

ブロック内の最後の文を実行したら1回目の繰り返しが終了です。そしてwhile文の最初に戻り改めて条件式を評価します。trueなら再度繰り返しを行い、falseだった場合にはwhile文の次の文へ処理が移ります。

基本的にfor文と同じですが条件式を変化させる処理をブロック内で記述する必要があることを忘れないようにして下さい。

サンプルコード

では簡単なサンプルで試してみます。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
 "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta http-equiv="Content-Script-Type" content="text/javascript">
<title>JavaScript テスト</title>
</head>
<body>

<script type="text/javascript" src="./js/script6_1.js">
</script>

</body>
</html>
var num = 1;

document.write("<p>");

while (num < 50){
  document.write("num = " + num + "<br />");
  num *= 2;
}

document.write("</p>");

上記を実際にブラウザ見てみると次のように表示されます。

p6-1

JavaScript入門の他の記事を見てみる

( Written by Tatsuo Ikura )

関連記事 (一部広告含む)