do while文を利用した繰り返し処理 - JavaScript

JavaScriptでdo~whileを用いたループ処理を紹介します。

書式

do {
  /* ロジックを記述 */
} while ([条件式])
[条件式] がtrueである限り実行し続けます。
whileループとは異なり、条件式のチェックはループ実行後にされるため、最低1回はループブロック内の処理が実行されます。

コード例

<!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">
<head>
    <title></title>
    <script type="text/javascript" language="javascript">
        function onButtonClick() {
            var target = document.getElementById("output");
            var count = document.form1.textBox1.value;

            target.innerHTML = "";
            var i = 0;
            do {
                target.innerHTML = target.innerHTML + i + "<br/>";
                i++;
            } while (i < count);
        }
    </script></head>
<body>
    <form name="form1" action=""> 
    <div>ループ回数を入力して下さい</div>
    <input name="textBox1" type="text" value="" />
    <input type="button" value="Exec" onclick="onButtonClick();" />
    </form>

    <div id="output"></div>
</body>
</html>

解説

以下のコードがループ部分になります。ループ変数iの値がcount変数よりも小さい限りはループを繰り返します。whileループとは異なり、条件式のチェックはループ実行後にされます。
 do {
   target.innerHTML = target.innerHTML + i + "<br/>";
   i++;
 } while (i < count);

実行結果

ページ表示直後の画面です。


テキストボックスに5を入力し、[Exec]ボタンをクリックしたときの実行結果です。5回ループが実行されます。


テキストボックスに0を入力し、[Exec]ボタンをクリックしたときの実行結果です。whileループとは異なり、1回ループが実行されます。


著者
iPentecのメインプログラマー
C#, ASP.NET の開発がメイン、少し前まではDelphiを愛用
最終更新日: 2022-01-09
作成日: 2011-06-13
iPentec all rights reserverd.