반복문

반복문

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

while문

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

for문이 정해진 횟수만큼 반복한다면, while 문은 조건식이 true 일 경우에 계속해서 반복합니다.
조건식이 false가 되면 반복 행위를 멈추고 while문을 종료합니다.

do while문

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

조건에 따라 반복을 계속할지를 결정할 때 사용하는 것은 while 문과 동일합니다.
다만, 무조건 중괄호 {} 블럭을 한번 실행하고, 조건을 검사하여 반복을 결정합니다.

for문

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

for문은 특정 구문을 여러번 반복하고 싶을 때 반복하는 반복문입니다.

---

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

for(let i = 0;, i < 100;, i++) {
    document.write(i);
}

결과 확인하기

01234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
51525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899

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

i의 시작값을 조정하여 값을 수정할 수 있습니다.

for(let i = 1;, i <= 100;, i++) {
    document.write(i);
}

결과 확인하기

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950
51525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100

03. 1부터 100까지 출력하기(짝수)

 

for (let i = 0; i <= 100; i+=2) {
    document.write(i);
}

결과 확인하기

2468101214161820222426283032343638404244464850
525456586062646668707274767880828486889092949698100

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

 

for (i = 1; i <= 100; i++) {
    if (i % 5 == 0) {       // i를 5로 나누어 나머지가 0인 값을 출력합니다.
        document.write("<span style='color : blue'>" + i + "</span>");
    }             // 스팬태그 내부에 스타일 설정을 통해 색설정이 가능합니다.
    if (i % 7 == 0) {       // i를 7로 나누어 나머지가 0인 값을 출력합니다.
        document.write("<span style='color : red'>" + i + "</span>");
    }
}

결과 확인하기

5101520253035404550556065707580859095100
714212835424956637077849198

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

 

for (i = 1; i <= 100; i++) {
    if (i % 2 == 0) {
        document.write("<span style ='color : red'>" + i + "</span>");
    } else {        // i를 2로 나누어 나머지가 0이 아닌값을 출력합니다.
        document.write("<span style ='color : blue'>" + i + "</span>");
    }
}

결과 확인하기

135791113151719212325272931333537394143454749
51535557596163656769717375777981838587899193959799
2468101214161820222426283032343638404244464850
525456586062646668707274767880828486889092949698100

06. for문을 이용해서 1~100까지 출력(짝수는 빨강, 홀수는 파랑) : 조건부 연산자

 

for (let i = 1; i <= 100; i++) {
    (i % 2 == 0) ? document.write("<span style ='color : red'>" + i + "</span>") :
        document.write("<span style ='color : blue'>" + i + "</span>");
}       // if문의 생략을 통해 다음과 같이 표기가 가능합니다.

결과 확인하기

135791113151719212325272931333537394143454749
51535557596163656769717375777981838587899193959799
2468101214161820222426283032343638404244464850
525456586062646668707274767880828486889092949698100

07. for문을 이용해서 구구단 만들기

 

// for문을 이용해서 구구단 만들기
// (2, 3, 4, 5, 6, 7, 8, 9) 8번 반복
// (1, 2, 3, 4, 5, 6, 7, 8, 9) 9번 반복

// i * j = sum
// 2 * 1 = 2       3 * 1 = 3       4 * 1 = 4
// 2 * 2 = 4
// 2 * 3 = 6
// 2 * 4 = 8
// 2 * 5 = 10
// 2 * 6 = 12
// 2 * 7 = 14
// 2 * 8 = 16
// 2 * 9 = 18

for (let i = 6; i <= 6; i++) {       // i값과 비교 대상값을 변경하여 다른 구구단도 가능합니다.
    for (let j = 1; j <= 9; j++) {       // 곱해지는 값을 설정합니다.
        let sum = i * j;
        document.write(i + " * " + j + " = " + sum);
        document.write("<br>");
    }
}

결과 확인하기

6 * 1 = 6
6 * 2 = 12
6 * 3 = 18
6 * 4 = 24
6 * 5 = 30
6 * 6 = 36
6 * 7 = 42
6 * 8 = 48
6 * 9 = 54

08. for문을 이용해서 테이블 출력하기

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

let table = "<table>";

for (let i = 0; i < 10; i++) {       
    table += "<tr>";      // 테이블의 행을 10줄 생성합니다.
        for (let j = 0; j < 10; j++) {
            table += "<td>1</td>"       // 테이블의 행별로 칸을 10칸 생성합니다.
        }
    table += "</tr>";
}
table += "</table>"

document.write(table);

결과 확인하기