logo

TechCodeview

JavaScript ループ

JavaScript ループは、反復的なタスクを効率的に処理するために不可欠です。指定された条件が true である限り、コードのブロックを繰り返し実行します。これらのループは、タスクを自動化し、コードを合理化するための強力なツールです。

たとえば、印刷したいとします。 こんにちは世界 5回。これは、JS Loop を使用して簡単に実行できます。ループでは、ステートメントを 1 回だけ記述する必要があり、以下に示すようにループが 5 回実行されます。



JavaScript 
for (let i = 0; i < 5; i++) {  console.log('Hello World!'); }>
出力 
Hello World! Hello World! Hello World! Hello World! Hello World!>

目次

1.ループ用のJavaScript

の JS for ループ は、ループ構造を記述する簡潔な方法を提供します。 for ループには、初期化、条件、およびインクリメント/デクリメントが 1 行に含まれているため、より短くデバッグしやすいループ構造が提供されます。

構文 

for (initialization; testing condition; increment/decrement) { statement(s) }>

フローチャート



  • 初期化条件: 変数を初期化し、for ループの開始をマークします。すでに宣言されている変数を使用することも、ループに対してのみローカルに変数を宣言することもできます。
  • テスト条件: for ループの終了条件をテストするために使用されます。ブール値を返す必要があります。それはまた、 エントリ制御ループ ループ ステートメントの実行前に条件がチェックされるためです。
  • ステートメントの実行: 条件が true と評価されると、ループ本体内のステートメントが実行されます。
  • 増加/減少: これは、次の反復で変数を更新するために使用されます。
  • ループの終了: 条件が false になると、ループは終了し、ライフ サイクルの終了を示します。

例

JavaScript 
// JavaScript program to illustrate for loop let x; // for loop begins when x = 2 // and runs till x <= 4 for (x = 2; x <= 4; x++) {  console.log('Value of x: ' + x); }>
出力 
Value of x: 2 Value of x: 3 Value of x: 4>

2. JavaScript while ループ

の JSのwhileループ は、指定されたブール条件に基づいてコードを繰り返し実行できるようにする制御フロー ステートメントです。 while ループは、繰り返しの if ステートメントと考えることができます。

構文 

while (boolean condition) { loop statements... }>

フローチャート

while ループ

  • While ループは条件のチェックから始まります。 true と評価された場合は、ループ本体のステートメントが実行され、それ以外の場合は、ループに続く最初のステートメントが実行されます。このため、 とも呼ばれます。 入口制御ループ
  • 条件が true と評価されると、ループ本体内のステートメントが実行されます。通常、ステートメントには、次の反復で処理される変数の更新された値が含まれます。
  • 条件が false になると、ループが終了し、ライフ サイクルの終わりが示されます。

例

JavaScript 
// JavaScript code to use while loop let val = 1; while (val < 6) {  console.log(val);   val += 1; }>
出力 
1 2 3 4 5>

3. JavaScript do-while ループ

の JS do-while ループ これは while ループに似ていますが、唯一の違いはステートメントの実行後に条件をチェックすることです。したがって、これは while ループの例です。 制御ループを終了します。 条件が false のイベントが少なくとも 1 回はループ コンテンツを実行します。



構文 

do { Statements... } while (condition);>

フローチャート 一方を行います

  • do-while ループはステートメントの実行から始まります。初めての為、状態の確認は行っておりません。
  • ステートメントの実行と変数値の更新後、条件が true または false の値についてチェックされます。 true と評価されると、ループの次の反復が開始されます。
  • 条件が false になると、ループが終了し、ライフ サイクルの終わりが示されます。
  • do-while ループは条件がチェックされる前に少なくとも 1 回ステートメントを実行するため、終了制御ループの例であることに注意することが重要です。

例

JavaScript 
let test = 1; do {  console.log(test);  test++; } while(test <= 5)>
出力 
1 2 3 4 5>

4. JavaScriptのfor-inループ

JSのfor-inループ オブジェクトのプロパティを反復処理するために使用されます。 for-in ループは、列挙可能プロパティが true に設定されているオブジェクトのキーに対してのみ反復されます。

構文

for(let variable_name in object_name) { // Statement }>

例： この例は、for-in ループの使用法を示しています。

JavaScript 
let myObj = { x: 1, y: 2, z: 3 }; for (let key in myObj) {  console.log(key, myObj[key]); }>
出力 
x 1 y 2 z 3>

5. JavaScriptのfor-ofループ

JSのfor-ofループ 配列、オブジェクト、セット、マップなどの反復可能なオブジェクトを反復するために使用されます。指定された反復可能オブジェクトの値を直接反復し、for ループよりも簡潔な構文を持ちます。

構文：

for(let variable_name of object_name) { // Statement }>

例： この例は、for-of ループの使用法を示しています。

JavaScript 
let arr = [1, 2, 3, 4, 5]; for (let value of arr) {  console.log(value); }>
出力 
1 2 3 4 5>

6. JavaScript ラベル付きステートメント

JSラベルキーワード goto キーワードは含まれません。ユーザーは、label ステートメントで continue キーワードを使用できます。さらに、ユーザーは、break キーワードを使用してループ/ブロックを終了できます。ラベルを定義せずに Break キーワードを使用することもできますが、終了するのは親ループ/ブロックのみです。 Break キーワードを使用して内側のループから外側のループを終了するには、ユーザーはラベルを定義する必要があります。

構文

Label: statement (loop or block of code)>

例

JavaScript 
let sum = 0, a = 1;  // Label for outer loop  outerloop: while (true) {   a = 1;   // Label for inner loop   innerloop: while (a < 3) {   sum += a;   if (sum>12) { // 内側のループから外側のループを中断します Break externalloop;   console.log('sum = ' + sum);   a++;   } }>>
出力 
sum = 1 sum = 3 sum = 4 sum = 6 sum = 7 sum = 9 sum = 10 sum = 12>

7. JavaScript Break ステートメント

JS ブレーク ステートメント 条件が true の場合に、ループまたは switch ステートメントの実行を終了するために使用されます。

構文

break;>

例

JavaScript 
for (let i = 1; i < 6; i++) {  if (i == 4)   break;    console.log(i); }>
出力 
1 2 3>

8. JavaScript Continue ステートメント

JS の continue ステートメント ループの反復を中断し、次の反復を続行するために使用されます。反復の中断は、指定された条件が発生する場合にのみ可能です。 continue と Break ステートメントの主な違いは、break ステートメントはループから完全に抜け出すのに対し、 continue は 1 つのステートメントを中断して次のステートメントを反復するために使用されることです。

構文

continue;>

例

JavaScript 
for (let i = 0; i < 11; i++) {  if (i % 2 == 0)   continue;    console.log(i); }>
出力 
1 3 5 7 9>

9. JavaScriptの無限ループ（ループエラー）

あらゆる種類のループを実装する際に最もよくある間違いの 1 つは、ループが終了しない可能性があることです。つまり、ループが無限回実行されることです。これは、何らかの理由で条件が失敗した場合に発生します。

例： この例は無限ループを示しています。

JavaScript 
// JavaScript program to illustrate infinite loop // Infinite loop because condition is not false // condition should have been i>0. for (let i = 5; i != 0; i -= 2) { console.log(i); x = 5 とします。 // update ステートメントが提供されていないため、無限ループ // while (x == 5) { console.log('ループ内'); }>>