JavaScriptループ回数を完全マスター！5つの使い方と応用例

はじめに

この記事を読めば、JavaScriptのループ回数の取得方法を完全にマスターできるようになります。

使い方や注意点、カスタマイズ方法もサンプルコード付きで解説しているので、JavaScriptを触ったことがない初心者でも分かりやすい内容になっています。

JavaScriptには、繰り返し処理を行うためのループ構文がいくつかあります。

下記に主なループ構文を紹介します。

一定回数の繰り返し処理を行う場合に使用します。

ある条件が満たされている間、繰り返し処理を行います。

最低一回は処理を実行し、その後条件が満たされている間繰り返し処理を行います。

それぞれのループ構文でループ回数を取得する方法を、サンプルコード付きで解説します。

// forループで10回繰り返す
for (let i = 1; i <= 10; i++) {
  console.log(i); // 現在のループ回数を表示
}

このコードでは、forループを使って10回繰り返し処理を行います。

iはループの回数を表し、1から始まり、10になるまで1ずつ増加します。

console.log(i);で現在のループ回数が表示されます。

// whileループで10回繰り返す
let count = 1;

while (count <= 10) {
  console.log(count); // 現在のループ回数を表示
  count++;
}

whileループを使った場合、countという変数を使ってループ回数を管理します。

countが10以下である間、ループが続けられます。

console.log(count);で現在のループ回数が表示されます。

// do-whileループで10回繰り返す
let loopCount = 1;

do {
  console.log(loopCount); // 現在のループ回数を表示
  loopCount++;
} while (loopCount <= 10);

do-whileループでは、最低1回は処理が実行されます。loopCountが10以下である間、ループが続けられます。

console.log(loopCount);で現在のループ回数が表示されます。

// 配列の要素を順番に表示する
const fruits = ["apple", "banana", "cherry"];

for (let i = 0; i < fruits.length; i++) {
  console.log(fruits[i]); // 配列の要素を表示
}

このコードでは、fruitsという配列の要素を順番に表示します。

fruits.lengthは配列の要素数を取得しており、ループ回数として利用されます。

// 条件に応じてループを抜ける
for (let i = 1; i <= 10; i++) {
  if (i === 5) {
    break; // ループを抜ける
  }
  console.log(i); // 現在のループ回数を表示
}

このコードでは、iが5になった時点でbreakを使ってループを抜けます。

そのため、1から4までの数値が表示され、5以降は表示されません。

ループ処理を行う際には、ループ条件やループ内での変数の操作に注意し、意図しない無限ループを回避しましょう。

無限ループが発生すると、プログラムが停止せず、ブラウザが応答しなくなることがあります。

配列とループを組み合わせる際には、配列の範囲外にアクセスしないように注意しましょう。

範囲外にアクセスすると、エラーが発生したり、予期しない動作が起こる可能性があります。

この記事では、JavaScriptでのループ回数の取得方法について、forループ、whileループ、およびdo-whileループを用いたサンプルコードとともに詳しく解説しました。

また、応用例や注意点についても触れました。

これらの知識を活用し、効率的なプログラムを作成していきましょう。