[생활코딩] JS문법: 반복문(loop or iterate)

▶반복문의 문법은 몇 가지가 있으며 각각의 구문은 서로 대체 가능하기 때문에 상황과 취향에 따라서 선택하여 사용하면 된다. 

while 

기본형식 

while(조건){
 // 반복해서 실행할 코드
}

 

• 조건에는 당연히 Boolean데이터타입이 와야 합니다. 
• 조건의 Boolean이 true 에서 false가 될 때까지 반복됩니다. 
• 조건식이 계속해서 true일 경우, 무한루프에 빠지게 되며 이는 쉽게 발생할 수 있는 오류입니다.

 let i = 0; //초기화
 while (i < 10) {
 document.write(`Coding EveryBody! I am number ${i + 1}<br />`);
 i = i + 1;}

 

for 

기본형식

for(초기화; 반복조건; 반복이 될 때마다 실행되는 코드){
    반복해서 실행될 코드
}

• while문을 한줄로 축약해놓은 ver이라고 생각된다.
• while문보다 짧지만 단점이 있다면 초기화; 반복조건; 반복될 때마다 실행되는 코드 를 기억하는 것
• ()소괄호의 마지막에 오는 "반복이 될 때마다 실행되는 코드"의 마지막에는 세미콜론이 붙지 않습니다.
• 반복문이 끝나면 중괄호 밖의 코드가 실행됩니다. 

    //초기화, Boolean(반복 조건), 반복 실행 코드
for (let i = 0; i < 10; i++) {
        document.write(`Coding EveryBody! I am number ${(i + 1)}<br />`);
      }
      /* 주의: 백틱을 사용해서 함수${i + 1}을 해도 같은 결과물이 나오지만 백틱을 사용하지 않는다면 
      소괄호를 통해서 "Coding EveryBody! I am number "+(i + 1)+ "<br / >" 
      이런식으로 구분하여 써줘야 합니다. */

TIP: i = i +1 은 i++와 같은 역할을 합니다.

//++i는 위의 코드에서는 i++와 큰 차이가 없지만 먼저 증가시키고 i를 쓰느냐 나중에 증가시키느냐 차이입니다. 

반복문의 제어

break

-반복작업을 중간에 중단시키고 싶다면 break를 사용하면 됩니다.

-조건문 안에 반복문이 들어갈 수 있고 반대로도 가능합니다. 

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

continue

-실행을 즉시 중단하면서 반복은 지속되게 해줍니다.

for(var i = 0; i < 10; i++){
    if(i === 5) {
        continue;
    }
    document.write('coding everybody'+i+'<br />');
}
/*output:
coding everybody 0
coding everybody 1
coding everybody 2
coding everybody 3
coding everybody 4 // 5가 빠져있다.
coding everybody 6
coding everybody 7
coding everybody 8
coding everybody 9
*/

-> 위의 break코드에서는 i가 5가 됐을 때, 아예 반복을 멈춰버리지만 continue의 경우 i가 5가 됐을 때만 실행이 중단되고 그 이후의 반복문은 정상작동됩니다.

 

반복문의 중첩

-반복문 안에는 반복문이 들어갈 수 있습니다. 

-개발자도구- > source -> 디버거 기능을 사용하면 어떻게 돌아가는 지 확인할 수 있습니다. 

for (let i = 0; i < 10; i++) {
        for (let j = 0; j < 10; j++) {
          document.write(`hello ${i}${j} <br/>`);
        }
      }

디버깅하길 원하는 코드 줄에 브레이크 포인트를 걸어두고 아래 체크해놓은 버튼을 누르면 한단계씩 반복문이 진행되는 것을 확인할 수 있습니다.

 

반복문은 배열과 만났을 때 진가를 발휘하므로 개념을 잘 숙지해놓읍시다.