ループを終了し次のループに移る (continue文の利用) - JavaScript

JavaScriptで次のループを終了し、次のループに移るための方法を紹介します。

概要

ループの途中でループの処理を終了し、次のループに移るためには、continue文を用います。

書式

continue;

コード例

<!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");
            for (i = 0; i < 15; i++) {
                if ((i % 3)==0) continue;
                target.innerHTML = target.innerHTML + i + "<br/>";
            }
        }
    </script></head>
<body>
    <form name="form1" action=""> 
    <input type="button" value="Exec" onclick="onButtonClick();" />
    </form>
    <div id="output"></div>
</body>
</html>

解説

下記のコードでボタンを表示します。ボタンがクリックされた場合はonButtonClick()関数を実行します。
 <input type="button" value="Exec" onclick="onButtonClick();" />;

ボタンクリックで実行される関数部分が以下になります。forループ内の次のコードでループ変数が3の倍数ならば以降のループの処理をせずに次のループに移ります。
if ((i % 3)==0) continue;

それ以外の場合以下のコードでループ変数の内容を画面に表示します。
target.innerHTML = target.innerHTML + i + "<br/>";

function onButtonClick() {
  var target = document.getElementById("output");
  for (i = 0; i < 15; i++) {
    if ((i % 3)==0) continue;
    target.innerHTML = target.innerHTML + i + "<br/>";
  }
}

実行結果

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


[Exec]ボタンをクリックした場合の実行結果です。3の倍数が画面には表示されないことがわかります。


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