ywork2020.com

Title

ループ制御文から抜け出す

目次 (INDEX)

break制御文の概要

break とは次のような意味の単語です。
break
読み: ブレイク
意味: 切断する、壊す

これはjavascriptの制御文の一つです。

for文やwhile文などのループ制御文から抜け出すために使われる制御文であり、ある条件に合致した場合にループから抜け出すためには、 if文などの条件制御文のブロックに使うことになります。

またループだけでなく、switch文のcase節やラベル文を中断して次のプログラムに制御を移すことにも用いられます。

目次に戻る

実機サンプル

この検証サンプルではwhile文のループから、if文の特定の条件に合致した場合にループから抜けて次行のコードに進んでいることが確認できます。

実行: break文無し

while文を使って"0"を10回、出力します。

答え: id="idAnswer"
innerText

実行: break文有り

while文を使って"0"が10回、出力する途中に、
if文とbreak文を使って5回目でループを抜けます。

目次に戻る

サンプルコード

break文無しのコード

<body>
	<output id="idAnswer">innerText</output>
	<script>
		document.open();
		let elmAnswer = document.getElementById("idAnswer");
		let numCount = 0;
		elmAnswer.innerText = "";
		while(numCount!==10){
			elmAnswer.innerText = elmAnswer.innerText + "0";
			numCount++;
		}
		elmAnswer.innerText = elmAnswer.innerText + "(0が"+numCount+"個)";
		document.close();
	</script>
</body>

break文有りのコード

<body>
	<output id="idAnswer">innerText</output>
	<script>
		document.open();
		let elmAnswer = document.getElementById("idAnswer");
		let numCount = 0;
		elmAnswer.innerText = "";
		while(numCount!==10){
			elmAnswer.innerText = elmAnswer.innerText + "0";
			numCount++;
			if(numCount==5){
				break;
			}
		}
		elmAnswer.innerText = elmAnswer.innerText + "(0が"+numCount+"個)";
		document.close();
	</script>
</body>

目次に戻る

サンプルコードの要点

break文無しと有りの共通要点
  1. output要素id="idAnswer"が検証結果を表示するための要素です。
  2. 変数「elmAnswer」に結果出力用のElementオブジェクトを代入しました。
  3. カウンター変数「numCount」の初期設定で0を代入しています。
  4. elmAnswer.innerText = "";で結果の初期化を行っています。
  5. while文でnumCountが10になるまでループ処理を行っています。(0という文字を書き出しています。)
  6. numCount++;でカウンター変数を1ずつ加算しています。
ここからがbreak文有りの処理ですが、if文でカウンター変数が5になった時にbreak文で強制的にループを抜けています。以上です。

目次に戻る