웹 프로그래밍 기초/반복문

중첩 for문

별초롱언니 2025. 4. 3. 12:57

01. 개념

for문 안에 또 다른 for문을 작성하는 것

**이 때 초기값을 담는 변수명은 다르게 작성하는 것이 좋다. 보통은 i,j,k ...  순으로 작성한다.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    // 1학년 1반 ~ 3학년 10반 출력
    var output = ""; // 데이터 유형을 문자열 - 비워둠

    // 학년 반복 - 1학년 ~ 3학년
    for (var i = 1; i <= 3; i++) {
      output += '<h3>====' + i + '====</h3>';

      // 반을 반복 - 1반 ~ 10반 
      for(var j = 1; j <= 10; j++) {
        output += '<p>' + i + '학년 ' + j + '반</p>';
      }
    }
    document.write(output);
  </script>
</body>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>구구단 만들기</title>
</head>
<body>
  <script>
    var output = ""; 

    for (var i = 2; i <= 9; i++) {
      output += '<h3>== ' + i + '단 ==</h3>'
  
      for (var j = 1; j <= 9; j++) {
        output += '<p>' + i + " X " + j + " = " + ( i * j )  +'</p>';
      }
    }
    document.write(output);
  </script>
</body>
</html>