JavaScript 반복문

반복문

반복문은 프로그램에서 필요한 결과 값을 도출하기 위해 실행문의 순서를 반복적으로 실행시키는 문법을 말합니다. 반복문에는 while문, do while문, for문이 있으며 for문을 가장 많이 사용합니다.

while문

while문은 조건식이 참이면 실행문을 실행합니다.

초기 값
while (조건식) {
    실행문;
    증가감식;
}

do while문

while문과 달리, do while문은 do를 먼저 실행하기 때문에 첫번째 실행은 조건에 상관없이 실행합니다.

초기 값
do {
    실행문;
    증가감식;
} while (조건식)

for문

for문은 조건식이 참인 동안 {}안의 실행문을 반복합니다. for문은 중첩하여 사용할 수 있습니다.

for ( 초기값; 조건식; 증감값 ){
    실행문;
}

---

for문을 이용한 다양한 예제

01. 0부터 99까지 출력하기

0부터 시작하여 변수가 100이 되기 전까지, 숫자 0~99를 출력합니다.

for( let i=0; i<100; i++ ){  //0부터 99까지
    document.write(i);
}

결과보기

0123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899

02. 1부터 100까지 출력하기

변수의 값을 0에서 시작하면 출력값 또한 0부터 시작하기 때문에, 1에서 시작해야 1부터 100까지 출력할 수 있습니다.

for( let i=0; i<=100; i++ ){  //1부터 100까지 출력
    document.write(i);
}

결과보기

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100

03. 0부터 100까지 짝수 출력하기

짝수를 출력할 때에는 변수의 값을 2씩 증가시킵니다. 홀수를 출력할 때에도 같지만, 변수의 값을 1에서부터 시작해야 합니다.

for( let i=2; i<=100; i+=2 ){  //0은 짝수가 아니기에 2부터 시작. i+=2와 i=i+2은 같다. 대입 연산자
    document.write(i);
}

결과보기

2468101214161820222426283032343638404244464850525456586062646668707274767880828486889092949698100

04. for문을 이용해서 1~100까지 출력(5의 배수, 7의 배수)

나머지를 구하는 % 연산자를 사용하였습니다.

for( let i=1; i<=100; i++){
    if ( i % 5 == 0){
        document.write("<span style='color: blue'>"+i+"</span>");  //5의 배수 출력
    }
    if ( i % 7 == 0 ){
    document.write("<span style='color: red'>"+i+"</span>");  //7의 배수 출력
    }
} 

결과 확인

05. for문을 이용해서 1~100까지 출력(짝수는 빨강, 홀수는 파랑)

짝수를 구할 때 %를 사용하였습니다. 짝수를 구하면 그 나머지는 홀수가 됩니다.

for( let i=1; i<=100; i++){
    if(i % 2 == 0){
        document.write("<span style='color: red'>"+i+"</span>");    //span 태그 안에는 따로 style을 지정할 수 있다.
    } else {
        document.write("<span style='color: blue'>"+i+"</span>");
    }
}

결과 확인

06. for문을 이용해서 구구단 출력하기

구구단을 출력할 때에는 중첩 for문을 이용합니다. 변수 i를 출력하는 for문이 한번 실행될 동안 j와 sum을 출력하는 for문은 9번 실행됩니다.

for( let i=2; i<=9; i++){
    for( let j=1; j<=9; j++){
        let sum = i * j;
        document.write(i+" * "+j +" = "+sum,"<br>");
    }
    document.write("<br>");
}   

결과 확인

07. for문을 이용해서 테이블 출력하기(1)

중첩 for문을 이용해서 테이블을 만들 수 있습니다.

//for문을 이용해서 테이블 출력하기(100칸)
let box = 10;
let box2 = 10;
let table = "<table>";

for( let i=0; i<box; i++){
    table += "<tr>";
    
    for( let j=0; j<box2; j++){
        table += "<td>ㅎ</td>";
    }
    table += "</tr>";
}

table += "</table>";

document.write(table);

결과 확인