while 루프는 주어진 조건식이 참(true)인 동안 특정 문장이나 코드 블록을 반복해서 실행하는 제어문입니다. 조건식의 결과가 거짓(false)으로 평가되는 순간 루프는 종료됩니다.
중첩 while 루프란?
while 루프 안에 또 다른 while 루프를 포함시키는 구조를 중첩 while 루프(nested while loop)라고 합니다. 바깥쪽 루프가 한 번 실행될 때마다 안쪽 루프 전체가 처음부터 끝까지 반복됩니다.
대표적인 활용 예시로는 2차원 배열 순회, 구구단 출력, 별(*) 패턴 그리기 등이 있습니다. 아래 예제에서는 바깥쪽 루프가 행(row)을 담당하고, 안쪽 루프가 열(column)을 담당하여 사각형 모양의 '#' 패턴을 화면에 출력합니다.
예제 코드
다음 코드를 직접 실행해 보면서 중첩 while 루프의 동작 방식을 확인해 보세요.
<html>
<body>
<script>
var height = 2;
var width = 8;
var col = 0;
var row = 0;
document.write("Starting Loop<br> ");
while (row < height) {
col = 0;
while(col < width) {
document.write("#");
col++;
}
document.write("<br>");
row++;
}
document.write("Loop stopped!");
</script>
</body>
</html>실행 결과
Starting Loop ######## ######## Loop stopped!
코드 동작 원리
1. 변수 height(2)와 width(8)로 출력할 행과 열의 개수를 정합니다.
2. 바깥쪽 while 루프는 row 값이 height보다 작은 동안 반복됩니다.
3. 바깥쪽 루프가 한 번 실행될 때마다 col을 0으로 초기화한 후, 안쪽 while 루프가 col이 width보다 작은 동안 '#' 문자를 8번 출력합니다.
4. 한 행이 완성되면 줄바꿈(<br>)을 출력하고 row 값을 1 증가시킵니다.
5. row가 2에 도달하면 조건식이 거짓이 되어 루프가 종료되고, 마지막 메시지가 출력됩니다.
이처럼 중첩 while 루프를 사용하면 행과 열로 이루어진 격자 형태의 데이터나 패턴을 손쉽게 처리할 수 있습니다.