読み込み中...

JavaScriptでループを抜ける方法5選!初心者も分かる徹底解説

JavaScriptループ抜ける方法イメージ JS
この記事は約5分で読めます。

【サイト内のコードはご自由に個人利用・商用利用いただけます】

この記事では、プログラムの基礎知識を前提に話を進めています。

説明のためのコードや、サンプルコードもありますので、もちろん初心者でも理解できるように表現してあります。

本記事のサンプルコードを活用して機能追加、目的を達成できるように作ってありますので、是非ご活用ください。

※この記事は、一般的にプロフェッショナルの指標とされる『実務経験10,000時間以上』を満たす現役のプログラマチームによって監修されています。

※Japanシーモアは、常に解説内容のわかりやすさや記事の品質に注力しております。不具合、分かりにくい説明や不適切な表現、動かないコードなど気になることがございましたら、記事の品質向上の為にお問い合わせフォームにてご共有いただけますと幸いです。
(送信された情報は、プライバシーポリシーのもと、厳正に取扱い、処分させていただきます。)

はじめに

この記事を読めば、JavaScriptループを抜ける方法を5つマスターすることができます。

ループ処理はJavaScriptでよく使用される技術ですが、初心者にとっては難しいと感じることがあります。

そこで、この記事では初心者目線でループを抜ける方法を徹底解説します。

サンプルコードも豊富に用意しているため、実際に手を動かしながら学ぶことができます。

●JavaScriptループとは

ループとは、プログラムの一部を繰り返し実行する処理です。

JavaScriptでは主に2種類のループが使われます。

○forループ

forループは、繰り返し回数があらかじめ決まっている場合に使用されます。

構文は下記のようになります。

for (初期化式; 条件式; 更新式) {
  // 繰り返し実行される処理
}

○whileループ

whileループは、繰り返し回数があらかじめ決まっていない場合に使用されます。

構文は下記のようになります。

while (条件式) {
  // 繰り返し実行される処理
}

●ループを抜ける方法5選

ループを抜ける方法として、下記5つの方法を紹介します。

それぞれの方法について、サンプルコードと詳細な説明を用意しています。

○サンプルコード1:ブレイク文を使う

ブレイク文は、ループ処理の途中でループを終了させることができます。

下記のサンプルコードでは、配列の要素を順番に出力し、値が5になった時点でループを終了しています。

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

for (let i = 0; i < numbers.length; i++) {
  if (numbers[i] === 5) {
    break; // 値が5の時にループを抜ける
  }
  console.log(numbers[i]);
}

○サンプルコード2:コンティニュー文を使う

コンティニュー文は、ループ処理の途中で次の繰り返しにスキップすることができます。

下記のサンプルコードでは、配列の要素を順番に出力し、値が偶数の場合は出力をスキップしています。

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

for (let i = 0; i < numbers.length; i++) {
  if (numbers[i] % 2 === 0) {
    continue; // 値が偶数の時に次の繰り返しにスキップ
  }
  console.log(numbers[i]);
}

○サンプルコード3:return文を使う

関数内のループであれば、return文を使ってループを抜けることができます。

下記のサンプルコードでは、配列の要素を順番に出力し、値が5になった時点で関数から抜けています。

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

function printNumbers() {
  for (let i = 0; i < numbers.length; i++) {
    if (numbers[i] === 5) {
      return; // 値が5の時に関数から抜ける
    }
    console.log(numbers[i]);
  }
}

printNumbers();

○サンプルコード4:フラグ変数を使う

フラグ変数を使って、ループを抜けるタイミングを制御することができます。

下記のサンプルコードでは、値が5になった時点でループを終了しています。

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
let shouldBreak = false;

for (let i = 0; i < numbers.length && !shouldBreak; i++) {
  if (numbers[i] === 5) {
    shouldBreak = true; // 値が5の時にフラグを立ててループを抜ける
  } else {
    console.log(numbers[i]);
  }
}

○サンプルコード5:例外処理を使う

例外処理を使って、ループを抜けることができます。

下記のサンプルコードでは、値が5になった時点でループを終了しています。

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];

try {
  numbers.forEach((number) => {
    if (number === 5) {
      throw new Error("値が5になったのでループを抜けます。");
    }
    console.log(number);
  });
} catch (error) {
  console.log(error.message);
}

●注意点と対処法

ループを抜ける方法を選ぶ際には、適切な方法を選択することが重要です。

ブレイク文やコンティニュー文はシンプルなケースで使いやすいですが、ネストされたループや複雑な条件がある場合は、フラグ変数や例外処理を検討してください。

また、ループ処理の中で無駄な処理を避けることで、パフォーマンスを向上させることができます。

ループを抜ける条件を最適化することで、不要な繰り返しを減らすことができます。

まとめ

この記事では、ループを抜ける方法5選を紹介しました。

それぞれの方法には独自の特徴があり、適切な状況で使い分けることが重要です。

また、ループを抜ける方法を選択する際には、パフォーマンスやコードの可読性を考慮して、最適な方法を選ぶようにしましょう。