자바스크립트 반복문 For와 While 사용하기

1. For 문

 For문은 주어진 조건이 참이면 For문을 수행하고 주어진 조건이 거짓이면 For문 다음 문장을 수행합니다. 가장 일반적으로 반복문을 사용할 때 For문을 사용합니다.

 또한 자바스크립트에서는 For문 외에도 For in, For of 등이 있습니다.

 

  ① For 문

    For 문의 구성은 다음과 같습니다.

 

     for ( 초기값 ; 조건문 ; 초기값의 변화량) {
                                                     실행문
       }

 

    For문은 주어진 초기값이 조건문에 부합하는지 확인하고 참이면 실행문을 실행합니다. 그리고 초기값을 초기값의 변화량만큼 변화시킵니다. 다시 변화된 초기값을 조건문에 부합하는지 확인하고 거짓이 될 때까지 실행문과 초기값의 변화량을 실행하며 For문을 반복 수행합니다.

 

    1부터 10까지 화면에 출력하는 반복문을 For문으로 만든다면 다음과 같습니다.

 

       for ( let i=1 ; i =< 10 ; i++ ) {

                            console.log(i);

       }

 

    변수 i의 초기값으로 1을 입력하고 값이 10보다 작거나 같은지를 검사합니다. 10보다 작으므로 

   console.log(i); 문을 실행하여 i의 값인 1을 화면에 출력합니다. 그리고, i값을 1 증가시켜서 2가 됩니다.

   이런 식으로 반복 수행하다가 i가 10이 됐을 경우 10과 같으므로 참이기 때문에 console.log(i); 문을 실행하여 i의 값인 10을 화면에 출력합니다. 그리고, i값을 1 증가시켜서 11이 됩니다. 이제 조건문과 비교할 때 i값이 10보다 크므로 거짓이 되어 더 이상 console.log(i); 문을 실행하지 않고 For문을 빠져나갑니다.

 

  ② For of 문

    For of 문의 구성은 다음과 같습니다.

 

       for ( let 변수명 of 객체) {

                                  실행문

       }

 

    For of 문은 객체의 요소를 하나씩 불러와 실행문을 실행합니다. 

 

    다음과 같이 예제를 작성합니다.

 

     let human = [ '유비', '관우', '장비' ]

     for ( let name of human) {

                            console.log( '이름 : ' + name );

     }

     

    For of 반복문은 human 배열의 요소를 name 변수에 입력합니다. 처음에는 '유비'가 name 변수에 입력됩니다. 그리고 console.log( ) 실행문을 실행합니다. 다음은 human 배열의 두 번째 요소를 name 변수에  입력하고 실행문을 실행합니다. human 배열의 마지막 요소까지 name 변수에 입력하여 실행문을 실행하면 For of 반복문은 종료됩니다.

 

    작성된 예제를 실행하면 아래 사각 박스와 같이 화면에 출력됩니다.

 이름 : 유비
 이름 : 관우
 이름 : 장비

  ③ For in 문

    For in 문의 구성은 다음과 같습니다.

 

       for ( let 변수명 in 객체) {

                                  실행문

       }

 

    For in 문은 객체의 요소를 불러와 실행문을 실행시킵니다. For of 문과의 차이점은 변수를 두어 0부터 실행문이 반복될 때마다 1씩 증가한다는 점입니다.

 

  다음 예제와 같이 작성하여 실행시킵니다.

 

       let person = ['유비', '관우', '장비']
       for (let name in person){
              console.log('이름 : ' + person [name])
       }

 

화면에는 다음과 같이 출력됩니다.

이름 : 유비
이름 : 관우
이름 : 장비

2. While 문

 While 문 역시 주어진 조건이 참이면 반복해서 실행되고 거짓일 때 반복이 중지되는 반복문입니다.

 

  ① While 문

    While 문의 구성은 다음과 같습니다.

 

       while (조건식) {

                       실행문

       }

 

    While 문은 조건식이 참일 경우 실행문을 실행합니다. 그리고 다시 조건식을 확인하여 참이면 실행문을 다시 실행합니다. 이렇게 실행하다가 조건식이 거짓이 되면 While 문은 중지되며 다음 명령으로 넘어갑니다.

 

    다음과 같이 예제를 작성합니다.

 

       let person = ['유비', '관우', '장비']
       let i = 0;
       while(i < person.length){
           console.log('이름 : ' + person [i])
           i++
       }

 

    예제를 실행하면 다음과 같이 화면에 출력됩니다.

이름 : 유비
이름 : 관우
이름 : 장비

 

  ② Do While 문

    Do While 문의 구성은 다음과 같습니다.

 

       do {

          실행문

       } while(조건식)

 

    Do While 문은 While 문과 달리 조건식이 실행문 뒤에 있습니다. 그러므로 Do While 문은 우선 실행문을 실행합니다. 그리고 조건식이 참인지 거짓인지 판단하여 참이면 다시 실행문을 반복 실행하고 거짓이면 Do While 반복은 종료되며 다음 문장으로 넘어갑니다. 

  Do While 문 반드시 한 번은 실행됩니다. 하지만, While 문의 경우에는 조건이 거짓이면 한 번도 실행되지  않고 종료될 수 있습니다.

 

    다음과 같이 예제를 작성합니다.

 

       let person = ['유비', '관우', '장비']
       let i = 0;
       do {
         console.log('이름 : ' + person [i])
         i++
       } while(i < person.length - 1)

 

    예제를 실행하면 다음과 같이 화면에 출력됩니다.

이름 : 유비
이름 : 관우

    예제에서 person.length는 배열의 길이, 즉 요소 개수를 구하는 것으로 여기에서는 person 배열의 요소는 3개이므로 3이 됩니다.

 

    한 가지 예제를 더 작성해 실행해 보겠습니다. 이번에는 Do While 문의 조건식을 처음부터 거짓을 만들기 위해 person.length - 1을 0으로 변경하여 실행해보겠습니다.

 

       let person = ['유비', '관우', '장비']
       let i = 0;
       do {
         console.log('이름 : ' + person [i])
         i++
       } while(i < 0)

 

    예제를 실행하면 다음과 같이 화면에 출력됩니다.

이름 : 유비

    예제를 통해 확인되듯이 Do While 문은 반드시 한 번은 실행된다는 사실을 기억해두시기 바랍니다.