> 웹 프론트엔드 > 프런트엔드 Q&A > JavaScript에서 for 루프를 사용하는 방법

JavaScript에서 for 루프를 사용하는 방법

WBOY
풀어 주다: 2023-05-16 10:07:07
원래의
1006명이 탐색했습니다.

JavaScript는 다양한 기능을 수행할 수 있는 강력한 프로그래밍 언어입니다. 가장 기본적인 루프 구조 중 하나는 for 루프입니다. 이를 통해 조건에 ​​따라 코드 조각을 반복적으로 실행할 수 있으며, 이는 개체 컬렉션을 반복적으로 작동하거나 배열을 탐색해야 하는 시나리오에 매우 적합합니다.

for 루프는 루프 초기화, 루프 조건, 루프 증분의 세 부분으로 구성됩니다. 구문 구조는 다음과 같습니다.

for (循环初始化; 循环条件; 循环增量) {
  // 循环执行的代码
}
로그인 후 복사

각 부분의 기능을 자세히 살펴보겠습니다.

  • 루프 초기화: 루프 시작 전에 한 번 실행되며 일반적으로 카운터 등의 변수를 초기화하는 데 사용됩니다.
  • 루프 조건: 루프 코드를 계속 실행할지 여부를 결정하는 데 사용됩니다. 조건이 true이면 루프를 계속하고, false이면 루프를 중지합니다.
  • 루프 증가: 각 루프가 끝난 후 한 번 실행되며 일반적으로 카운터와 같은 변수를 증가시키거나 감소시키는 데 사용됩니다.

다음으로 몇 가지 예시를 통해 for 루프의 사용법을 배워보겠습니다.

1. 배열 탐색

먼저 매우 일반적인 응용 시나리오인 배열 탐색을 살펴보겠습니다. 코드는 다음과 같습니다.

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

for (let i = 0; i < numbers.length; i++) {
  console.log(numbers[i]);
}
로그인 후 복사

위 코드는 숫자 배열을 정의한 다음 for 루프를 사용하여 배열의 각 요소를 반복합니다. 루프 조건 i <number.length는 실행될 루프의 조건을 결정하고, 증분 연산 i++은 각 루프가 증분되도록 합니다. 루프 본문에서는 console.log 함수를 사용하여 각 요소의 값을 인쇄합니다. 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>');
}
로그인 후 복사

代码中嵌套了两个 for 循环。外层循环变量 i 代表乘法表中的行数,内层循环变量 j 代表每一行中的列数。在每次内层循环结束后,我们会换行,以避免在同一行输出多个乘积。

以上代码实现了一个简单的乘法表,是初学者们很好的练习题目。

3. 嵌套的 for 循环实现数组求和

接下来,我们来看一个稍微复杂一点的例子:使用嵌套的 for 循环来对二维数组进行求和。代码如下:

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);
로그인 후 복사

以上代码定义了一个二维数组 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;
  }
}
로그인 후 복사

以上代码定义了一个敌人生命值和一个数组 playerAttack,其中存储了玩家的攻击力。使用 for 循环来模拟玩家在游戏中使用不同技能攻击敌人的行为。在每次循环中,我们会生成随机数来模拟技能命中后对敌人造成的伤害,并根据情况打印出相应的信息。

如果敌人生命值被扣减到 0 或以下,游戏结束,我们使用 break

2. 구구단 만들기

다음으로 for 루프를 사용하여 구구단을 만들어 보겠습니다. 코드는 다음과 같습니다: 🎜rrreee🎜코드에는 두 개의 for 루프가 중첩되어 있습니다. 외부 루프 변수 i는 곱셈표의 행 수를 나타내고, 내부 루프 변수 j는 각 행의 열 수를 나타냅니다. 동일한 라인에 여러 제품이 출력되는 것을 방지하기 위해 각 내부 루프 뒤에 라인을 래핑합니다. 🎜🎜위 코드는 초보자에게 좋은 연습 문제인 간단한 구구단을 구현한 것입니다. 🎜🎜3. 중첩된 for 루프는 배열 합산을 구현합니다🎜🎜다음으로 좀 더 복잡한 예를 살펴보겠습니다. 중첩된 for 루프를 사용하여 2차원 배열을 합산하는 것입니다. 코드는 다음과 같습니다. 🎜rrreee🎜위 코드는 2차원 배열 arrays를 정의한 다음 중첩된 for 루프를 사용하여 배열의 각 요소를 합산합니다. 외부 루프 변수 i는 배열의 각 행을 나타내고, 내부 루프 변수 j는 각 행의 열 수를 나타냅니다. 합계 연산 sum += arrays[i][j]는 배열의 각 요소를 누적합니다. 마지막으로 합산 결과 console.log(sum)를 출력합니다. 🎜🎜4. 게임에서 AI 시뮬레이션🎜🎜마지막으로 for 루프를 사용하여 게임에서 AI 동작을 시뮬레이션하는 흥미로운 예를 살펴보겠습니다. 코드는 다음과 같습니다. 🎜rrreee🎜위 코드는 적의 체력 값과 플레이어의 공격력을 저장하는 playerAttack 배열을 정의합니다. for 루프를 사용하여 게임에서 적을 공격하기 위해 다양한 기술을 사용하는 플레이어의 행동을 시뮬레이션합니다. 각 사이클마다 난수를 생성하여 스킬 적중 후 적에게 입힌 피해를 시뮬레이션하고 상황에 따라 해당 정보를 인쇄합니다. 🎜🎜적의 체력이 0 이하로 줄어들면 게임이 종료되며 break 문을 사용하여 루프를 강제 종료합니다. 🎜🎜위의 예를 통해 JavaScript에서 for 루프의 유연한 적용을 볼 수 있습니다. 이는 배열을 탐색하고, 곱셈표 및 기타 일반적인 연산을 구축할 수 있을 뿐만 아니라 게임에서 AI 동작을 시뮬레이션할 수도 있습니다. for 루프를 반복적으로 연습하고 사용하면 그 신비를 더 잘 이해하고 마스터할 수 있으며 자신의 프로그래밍 여정을 위한 견고한 기반을 마련할 수 있습니다. 🎜

위 내용은 JavaScript에서 for 루프를 사용하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿