중첩 for문
for문 안에 for문이 있는 형태입니다.
중첩 for문
for(var i=0; i<100; i++){
for(var j=0; j<100; j++){
//반복코드
}
}
Sample1 
중첩 for문을 이용한 예제입니다.
html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Javascript</title>
<script>
//for문을 이용해서 1~10까지 출력하세요~
for(var i=1; i<=10; i++){
document.write(i);
}
document.write("<br><br>");
//중첩 for문을 이용해서 1~10까지 출력하세요~
for(var i=1; i<=10; i++){
for(var j=1; j<=10; j++){
document.write(i +","+ j , "<br>");
}
}
</script>
</head>
<body>
</body>
</html>
Sample2
중첩 for문을 이용한 구구단 출력하기 예제입니다.
결과
2X1=2
2X2=4
2X3=6
2X4=8
2X5=10
2X6=12
.......
9X5=45
9X6=54
9X7=63
9X8=72
9X9=81
2X2=4
2X3=6
2X4=8
2X5=10
2X6=12
.......
9X5=45
9X6=54
9X7=63
9X8=72
9X9=81
html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Javascript</title>
<script>
//구구단을 출력하세요~
//num1 2 ~ 9 for(var i=2; i<=9; i++)
//num2 1 ~ 9 for(var j=1; j<=9; j++)
//num1 * num2 = sum
//2 * 1 = 2
//2 * 2 = 4
//2 * 3 = 6
//2 * 4 = 8
//3 * 1 = 3
//3 * 2 = 6
//3 * 3 = 8
//3 * 4 = 12
for(var i=2; i<=9; i++){
for(var j=1; j<=9; j++){
let sum = i * j;
document.write(i +"*"+ j +"="+ sum);
document.write("<br>");
}
}
</script>
</head>
<body>
</body>
</html>
Sample3
중첩 for문을 이용한 테이블 만들기 예제입니다.
결과
| 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 |
| 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 |
| 21 | 22 | 23 | 24 | 25 | 26 | 27 | 28 | 29 | 30 |
| 31 | 32 | 33 | 34 | 35 | 36 | 37 | 38 | 39 | 40 |
| 41 | 42 | 43 | 44 | 45 | 46 | 47 | 48 | 49 | 50 |
| 51 | 52 | 53 | 54 | 55 | 56 | 57 | 58 | 59 | 60 |
| 61 | 62 | 63 | 64 | 65 | 66 | 67 | 68 | 69 | 70 |
| 71 | 72 | 73 | 74 | 75 | 76 | 77 | 78 | 79 | 80 |
| 81 | 82 | 83 | 84 | 85 | 86 | 87 | 88 | 89 | 90 |
| 91 | 92 | 93 | 94 | 95 | 96 | 97 | 98 | 99 | 100 |
html
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<title>Javascript</title>
<script>
let num = 1;
let table = "<table border='1'>";
for(var i=1; i<=10; i++){
table += "<tr>";
for(var j=1; j<=10; j++){
table += "<td>"+ num +"</td>";
num++;
}
table += "</tr>";
}
table += "</table>";
document.write(table);
console.log(table);
</script>
</head>
<body>
<!-- <table border='1'>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
</tr>
</table> -->
</body>
</html>
