자바스크립트 반복문은 for 반복문은 초깃값, 조건식, 증감식을 한 줄에 작성합니다. while 반복문은 초깃값이 반복문 밖에 위치하며, 증감식이 반복문 내부에 위치합니다. do while 반복문은 실행문을 강제 1회 실행할 때 사용합니다.
자바스크립트 반복문의 필요성
자바스크립트에서 숫자 1부터 100까지 브라우저에서 출력을 하려면 코드를 100번 입력해야 합니다.
<script>
document.write( 1, '<br>' );
document.write( 2, '<br>' );
document.write( 3, '<br>' );
//...중략
document.write( 99, '<br>' );
document.write( 100, '<br>' );
</script>
반복문을 사용하면, 같은 결과를 5줄 이내의 코드로 작성할 수 있습니다.
<script>
var num;
for ( num = 1; num <= 100; num++ )
{
document.write( num, '<br>' );
}
</script>결과
1
2
3
...중략
99
100자바스크립트 반복문의 종류
대부분 프로그래밍 언어의 반복문은 종류와 형태가 비슷합니다. 자바스크립트의 반복문도 for문, while문, do while문이 있습니다. 반복문은 서로 전환이 가능합니다.
| 기호 | 형태 | 의미 |
|---|---|---|
| for | for (초깃값; 조건식; 증감문) | 조건식이 거짓이 될 때 까지 반복 |
| while | while (조건식) | 조건식이 거짓이 될 때 까지 반복 |
| do while | do {실행문} while (조건식) | 실행을 선 1회 하고, 조건식 검사로 반복 체크 |
자바스크립트 for 반복문
자바스크립트 for 반복문은 for () 사이에 작성된 조건에 따라서 {} 사이에 삽입된 실행문이 계속 반복되거나 중단됨을 결정합니다.
<script>
var num;
for ( 초깃값; 조건식; 증감식 )
{
실행문;
}
</script>초깃값은 반복문의 변수에 삽입될 처음의 데이터를 말합니다. 1부터 100을 출력하는 실행문이라면, 초깃값은 1부터 시작할 것입니다.
조건식은 {} 사이의 코드가 계속 반복될지, 중단될지를 결정하는 참/거짓 식입니다. 참이면 실행문이 계속 반복되고, 거짓이면 반복문이 종료됩니다.
증감식은 초깃값 즉 변수의 숫자를 변화시키는 역할을 합니다. 1부터 100까지 출력을 하려면 변수값이 1씩 자동으로 증가되야 할 것입니다.
<script>
var num;
for ( num = 1; num <= 100; num++ )
{
document.write( num, '<br>' );
}
</script>변수 num에 초깃값으로 1을 대입합니다. num 값이 100보다 작거나 같으면, 참이므로 { } 사이의 코드를 1회 실행합니다. 이후 num값이 num++ 증감식에 의해서 1 증가하고, 다시 처음으로 돌아옵니다. num값이 100보다 커지는 순간 조건식이 거짓이되므로 반복문이 중단됩니다.
자바스크립트 while 반복문
while 반복문은 for문과 구성요소는 같습니다. 초깃값, 조건식, 증감식으로 구성됩니다. 단지 요소의 배치만 위치가 다릅니다.
<script>
var num;
num = 초깃값;
while ( 조건식 )
{
실행문;
증감식;
}
</script>초깃값이 조건식 앞에 위치하고, 증감식이 { } 내부에 위치합니다. while () 괄호 사이에는 조건식만 위치합니다.
<script>
var num;
num = 1; //초깃값
while ( num <= 100 ) //조건식
{
document.write( num, '<br>'); //실행문
num++; //증감식
}
</script>자바스크립트 do while 반복문
do while 반복문은 조건식의 참/거짓과 무관하게 강제로 1회 실행을 해야할 때 사용합니다. for, while 반복문과 마찬가지로 초깃값, 조건식, 증감식의 같은 요소를 포함합니다.
한 가지 차이점은 보통 for, while 반복문은 조건식이 거짓인 경우 {} 블럭 사이의 실행문이 한 번도 실행되지 않을 수 있습니다. 하지만 do while은 조건식의 참/거짓과 무관하게 최초 1회는 강제로 실행시킬 수 있습니다. do라는 값에 실행문, 증감연산자가 위치하고 조건식이 while() 과 함께 do {} 코드 블록보다 뒤에 위치하기 때문입니다.
<script>
var num;
num = 초깃값;
do
{
실행문; //조건식과 무관하게 1회 강제 실행
증감식;
}
while ( 조건식 )
</script>while 문과 형태는 비슷하지만, 실행문, 증감 연산자이 do {} 코드 블록 사이에 위치하며, while 문보다 앞으로 나옵니다. 이렇게 배치를 하면, do { } 사이의 코드가 while () 의 조건식 보다 앞에 있어서 조건식을 검사하기 전에 코드가 미리 실행될 수 있을 것입니다.
<script>
var num;
num = 1; //초깃값
do
{
document.write( num, '<br>'); //실행문
num++; //증감식
}
while ( num <= 100 ) //조건식
</script>
조건식의 참/거짓과 무관하게 코드를 1회 강제 실행하고 싶은 경우 do while 반복문을 사용합니다. 그 외에 조건식의 필터링을 정확하게 지키고 싶다면 for 또는 while 반복문을 사용하면 됩니다.