[JavaScript] 자바스크립트 while문 사용법 & 예제 정리

반복문을 이용하면 코드를 원하는 횟수만큼 반복하여 실행할 수 있습니다. 반복문에는 while, do-while, for문 이렇게 3가지가 있는데요. 이번 포스팅에서는 그중에서 while문에 대해서 알아보려 합니다. while 문은 조건이 참인 동안 특정 코드 블록을 반복적으로 실행하는데 주로 특정 조건이 충족될 때까지 반복해야 할 경우에 사용됩니다.

 

---

 

 while문 사용법 

while (조건) {
  // 조건이 참일 때 실행될 코드 블록
}

위의 예제는 while문의 기본형입니다.  여기서 조건은 불리언(boolean) 값으로 표현될 수 있는 식을 말하며 해당 조건이 true인 동안, 중괄호 { } 안의 코드 블록이 반복해서 실행됩니다. 

 

while의 실행 순서

1. 조건식을 검사합니다.
2. 만족하면 중괄호 { } 안의 코드 블록을 실행합니다.
3. 다시 조건식을 검사합니다.

 

while문 사용 예제 - 구구단 출력하기

See the Pen while문 by wjdxo513 (@wjdxo513) on CodePen.

 

while문을 사용해서 구구단을 출력해 보았습니다. idx를 1에서 1씩 증가시키면서 10보다 클 때까지 계속해서 구구단을 출력합니다. 

 

 

while문 사용 시 주의사항

let i = 0;
while (i < 5) {
  console.log(i);
  // i를 업데이트하는 부분이 빠져있으면 무한 루프에 빠질 수 있음
}

while문을 사용할 때는 무한 루프에 빠지지 않도록 주의해야 합니다. 특히 비교하는 조건이 반복문 안에서 업데이트되지 않으면 항상 같은 값을 비교하게 되어 무한루프에 빠지게 됩니다. 예를 들어 위의 예제에서 i++; 를 빠트렸다면, i의 값은 항상 0으로 유지되어 무한 루프에 빠지게 되겠죠. 이렇게 while 문은 특정한 조건이 만족될 때까지 반복 실행되므로, 조건식을 신중하게 설정하여 의도치 않은 결과를 방지해야 합니다.

 

---

 

 while문에서의 break와 continue 

break - 반복문 탈출

• break 문은 루프를 즉시 종료하고 루프 외부로 빠져나가게 합니다.
• break가 실행되면 루프 조건의 판별 여부와 상관없이 루프가 종료됩니다.
• 주로 특정 조건이 충족되었을 때 루프를 종료하고자 할 때 사용됩니다.

 

See the Pen while break by wjdxo513 (@wjdxo513) on CodePen.

 

위의 예제를 보시면 idx값이 5보다 크면 break문이 실행되어 while 반복문을 탈출하여 5까지만 출력되는 것을 보실 수 있습니다.

 

 

continue - 반복문 건너뛰기

• continue 문은 현재 반복을 중단하고 다음 반복으로 진행합니다.
• continue가 실행되면 이후의 코드는 실행되지 않고 다음 반복의 시작 지점으로 이동합니다.
• 특정 조건일 때 현재 반복을 건너뛰고자 할 때 사용됩니다.

 

See the Pen do-while continue by wjdxo513 (@wjdxo513) on CodePen.

 

위의 예제를 보시면 idx값이 짝수(2로 나눈 나머지가 0)면 continue문이 실행되어 while 반복문을 건너뛰어 홀수만 출력되는 것을 보실 수 있습니다.

 

※ do-while문이 궁금하시다면 아래 글을 참고해 주세요.

[JavaScript] 자바스크립트 do-while문 사용법 & 예제 정리