【JavaScript】繰り返し処理(ループ)を途中で終了・スキップする方法

本記事では、JavaScriptで繰り返し処理(ループ)を途中で終了・スキップする方法についてサンプルコードを用いて解説しています。

サンプルコードはfor文を使用していますが、「while文」「 do…while文」「for…in文」「for…of文」でも使用することが可能です。

JavaScriptの学習におすすめ書籍

1冊ですべて身につくJavaScript入門講座

総合評価

( 5 )

メリット

• 誰でも分かるように嚙み砕いて説明してくれる
• アニメーションの知識が深く学べる
• 1つのWebサイトを作りながら学べる

1冊ですべて身につくJavaScript入門講座 [ Mana ]

楽天ブックス

¥2,794 （2023/12/09 22:54時点 | 楽天市場調べ）

Amazonで探す

楽天市場で探す

Yahoo!ショッピングで探す

ポチップ

先輩くん

Amazon Kindle Unlimitedに登録すると、月額980円で読み放題だからオススメだよ！

後輩ちゃん

初回30日間は無料だから、まだ登録したことのない人はぜひ試してみてね！

Amazon Kindle Unlimited

全プログラマー必見！
変数名/関数名にもう悩まない！

リーダブルコード

総合評価

( 5 )

メリット

• 美しいコードが書けるが自然と書けるようになる
• 他の開発者が理解しやすいコードになる

リーダブルコード ―より良いコードを書くためのシンプルで実践的なテクニック (Theory in practice)

著:Dustin Boswell, 著:Trevor Foucher, 解説:須藤 功平, 翻訳:角 征典

¥2,640 （2023/07/23 02:48時点 | Amazon調べ）

Amazonで探す

楽天市場で探す

Yahoo!ショッピングで探す

ポチップ

繰り返し処理(ループ)を強制終了する方法

繰り返し処理を強制終了するには、終了させたいタイミングで「break」を使います。

先輩くん

breakを使用したサンプルコードは以下のとおりだよ！

for (let i = 1; i <= 10; i++) {
  console.log(`${i}回目のループ`);
  if (i === 3) {
    console.log("ループを抜ける");
    break;
  }
}

/* コンソールログ *
 * 
 * 1回目のループ
 * 1回目のループ
 * 1回目のループ
 * ループを抜ける
 * 
 */

上記のコードは、本来であれば10回繰り返し処理が実行されますが「if(i === 3)」の箇所で、break;を使用しているため3回目の繰り返し処理(i = 3)で強制終了されます。

繰り返し処理(ループ)をスキップする方法

繰り返し処理をスキップするには、スキップさせたいタイミングで「continue」を使います。

先輩くん

continueを使用したサンプルコードは以下のとおりだよ！

for (let i = 1; i <= 10; i++) {
  if (i % 2 === 0) continue;
  console.log(`${i}回目のループ`);
}

/* コンソールログ *
 *
 * 1回目のループ
 * 3回目のループ
 * 5回目のループ
 * 7回目のループ
 * 9回目のループ
 *
 */

上記のコードは、カウンター変数iの値が偶数の時にcontinueが実行され繰り返し処理をスキップします。

そのため、後続にある「console.log(${i}回目のループ);」の処理が偶数の時には実行されずコンソールログの表示が「1回目・3回目・5回目」と奇数だけになっています。