ホームページ > ウェブフロントエンド > フロントエンドQ&A > JavaScriptでのforループの使い方

JavaScriptでのforループの使い方

WBOY
リリース: 2023-05-16 10:07:07
オリジナル
1002 人が閲覧しました

JavaScript は、多くの機能を備えた強力なプログラミング言語です。最も基本的なループ構造の 1 つは for ループです。これにより、条件に基づいてコードを繰り返し実行できるため、オブジェクトのコレクションを繰り返し操作したり、配列を走査したりする必要があるシナリオに非常に適しています。

for ループは、ループの初期化、ループ条件、およびループのインクリメントの 3 つの部分で構成されます。構文構造は次のとおりです:

for (循环初始化; 循环条件; 循环增量) {
  // 循环执行的代码
}
ログイン後にコピー

各部分の機能を詳しく見てみましょう:

  • ループの初期化: ループの開始前に 1 回実行され、通常はループの開始に使用されます。カウンタなどの変数を初期化します。
  • ループ条件: ループ コードの実行を継続するかどうかを決定するために使用されます。条件が true の場合はループを継続し、false の場合はループを停止します。
  • ループ インクリメント: 各ループの終了後に 1 回実行され、通常はカウンターなどの変数をインクリメントまたはデクリメントするために使用されます。

次に、いくつかの例を通して for ループの使用方法を学びましょう。

1. 配列の走査

まず、非常に一般的なアプリケーション シナリオ、つまり配列の走査を見てみましょう。コードは次のとおりです。

let numbers = [1, 2, 3, 4, 5];

for (let i = 0; i < numbers.length; i++) {
  console.log(numbers[i]);
}
ログイン後にコピー

上記のコードは、配列 numbers を定義し、for ループを使用して配列内の各要素を反復処理します。ループ条件 i <numbers.length は実行されるループの条件を決定し、インクリメント操作 i は各ループが確実にインクリメントされるようにします。ループ本体では、console.log 関数を使用して各要素の値を出力します。

2. 九九を作成する

#次に、for ループを使用して九九を作成してみます。コードは次のとおりです。

for (let i = 1; i <= 9; i++) {
  for (let j = 1; j <= i; j++) {
    document.write(`${j}x${i}=${i*j} `);
  }
  document.write('<br>');
}
ログイン後にコピー

コード内には 2 つの for ループがネストされています。外側のループ変数 i は乗算表の行数を表し、内側のループ変数 j は各行の列数を表します。各内部ループの後で、同じ行に複数の製品が出力されるのを避けるために行を折り返します。

上記のコードは、初心者にとって良い練習問題となる簡単な九九を実装しています。

3. ネストされた for ループを使用して配列の合計を実装する

次に、ネストされた for ループを使用して 2 次元配列を合計する、もう少し複雑な例を見てみましょう。コードは次のとおりです。

let arrays = [
  [1, 2, 3],
  [4, 5, 6],
  [7, 8, 9]
];

let sum = 0;

for (let i = 0; i < arrays.length; i++) {
  for (let j = 0; j < arrays[i].length; j++) {
    sum += arrays[i][j];
  }
}

console.log(sum);
ログイン後にコピー

上記のコードは、2 次元配列 arrays を定義し、ネストされた for ループを使用して配列内の各要素を合計します。外側のループ変数 i は配列内の各行を表し、内側のループ変数 j は各行の列数を表します。合計演算 sum = arrays[i][j] は、配列内の各要素を累積します。最後に、合計結果 console.log(sum) を出力します。

4. ゲームでの AI のシミュレーション

最後に、for ループを使用してゲームでの AI の動作をシミュレートするという興味深い例を見てみましょう。コードは次のとおりです。

let enemyHealth = 100;
let playerAttack = [10, 15, 20, 25, 30];

for (let i = 0; i < playerAttack.length; i++) {
  let damage = Math.floor(Math.random() * playerAttack[i]);
  enemyHealth -= damage;
  
  if (damage > 0) {
    console.log(`玩家使用技能${i+1},对敌人造成了${damage}点伤害!敌人还剩余${enemyHealth}点生命值。`);
  } else {
    console.log(`玩家技能${i+1}未能命中敌人!敌人还剩余${enemyHealth}点生命值。`);
  }
  
  if (enemyHealth <= 0) {
    console.log('敌人被击败了!');
    break;
  }
}
ログイン後にコピー

上記のコードは、敵の体力値と、プレイヤーの攻撃力を格納する配列 player Attack を定義します。 for ループを使用して、さまざまなスキルを使用してゲーム内の敵を攻撃するプレイヤーの動作をシミュレートします。各サイクルで、スキルヒット後に敵に与えるダメージをシミュレーションする乱数を生成し、状況に応じて対応する情報を出力します。

敵の体力が 0 以下になるとゲームは終了し、break ステートメントを使用してループを強制的に終了します。

上記の例を通じて、JavaScript での for ループの柔軟なアプリケーションがわかります。配列の走査、九九の作成、その他の一般的な操作だけでなく、ゲームでの AI の動作のシミュレーションも可能です。 for ループを繰り返し練習して使用することで、その謎をよりよく理解して習得し、独自のプログラミングの旅のための強固な基盤を築くことができます。

以上がJavaScriptでのforループの使い方の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート