JavaScript : Loop

반복문의 문법

while

while는 괄호안의 조건이 true이면 중괄호안의 코드를 반복적으로 실행한다.
여기서 Boolean은 시작/종료 조건이 된다.
만약 반복문에 종료 조건이 잘못 지정되면
무한 반복 되거나 반복문이 실행되지 않는다.

반복조건

위 코드는 무한반복 되는 것을 방지하기 위해 반드시 반복 조건을 만들어 줘야 한다.
아래 예시를 통해 어떻게 반복 조건이 만들어 지는지 참고한다.

[에시]

var i = 0;
// 종료조건으로 i의 값이 10보다 작다면 true, 같거나 크다면 false가 된다.
while(i < 10){
    document.write('coding everybody <br />');
		// 반복이 실행될 때마다 coding everybody <br />이 출력된다. <br /> 줄바꿈을 의미하는 HTML 태그
    i++;
		// i의 값이 1씩 증가한다.
}

for

한 라인에 초기화, 반복조건, 반복될때 실행되는 코드를 모두 작성하기 때문에
반복문을 작성할때 자주 사용한다.
아래 예시를 통해 어떻게 사용되는지 참고한다.

[예시]

for(var i = 0; i < 10; i++){
    document.write('coding everybody'+i+'<br />');
}

var i = 0; 부분이 초기화로 반복문을 처음 시작할때 한번만 실행된다.
i < 10; 부분은 반복되는 조건을 말한다.
i++부분은 반복될 때 실행되는 코드로 예시로는 반복횟수로 사용됐다.
작성 시 주의 사항은 마지막에 ;이 들어가지 않는다

추가로 위 예시 중 반복 횟수로 사용된 i++는
기존의 값을 사용한 다음 1을 더한다는 뜻으로 사용된다.
이와 비슷하게 ++i라는 코드도 있는데 이는 기존값에 먼저 1을 더한 후 사용한다.

[예시]

i=0;
// 0 //
i++;
// 0 //
i++;
// 1 //
i++;
// 2 //

i=0;
// 0 //
++i;
// 1 //
++i;
// 2 //

반복문의 제어

반복을 멈추게 하는 방법에는 2가지가 있다.

• break
  반복작업 중간에 중단시키는 방법으로 조건문을 조합하여 사용하면 된다.
  반복문 안에서 break가 실행되면 반복문을 즉시 종료시킨다.
  [예시]

for(var i = 0; i < 10; i++){
    if(i === 5) {
        break;
    }
    document.write('coding everybody'+i+'<br />');
}

/* 
coding everybody 0
coding everybody 1
coding everybody 2
coding everybody 3
coding everybody 4
*/

• continue
  반복작업을 중간에 한번 멈췄다가 계속 한다.
  [예시]

for(var i = 0; i < 10; i++){
    if(i === 5) {
        continue;
    }
    document.write('coding everybody'+i+'<br />');
}

/*
coding everybody 0
coding everybody 1
coding everybody 2
coding everybody 3
coding everybody 4
coding everybody 6
coding everybody 7
coding everybody 8
coding everybody 9
*/

반복문의 중첩

반복문 안에는 반복문을 추가로 작성할 수 있다.

[예시]

// 0부터 9까지 변수 i에 순차적으로 값을 할당        
for(var i = 0; i < 10; i++){
    // 0부터 9까지의 변수를 j의 값에 순차적으로 할당
    for(var j = 0; j < 10; j++){    
        // i와 j의 값을 더한 후에 출력
        // String은 숫자인 i와 j의 데이터 타입을 문자로 형태를 변환하는 명령이다. 
        // String()을 제거하고 실행해보면 의미가 좀 더 분명하게 드러날 것이다.
        document.write(String(i)+String(j)+'<br />');
    }
}