제어문

제어문은 조건에 따라 코드 블록을 실행 하거나 반복 실행 할 때 사용한다.

// 제어문
var x = 1;
if (x < 10) {
  x++;
}

블록문

블록문은 0개 이상의 문을 중괄호로 묶은 것으로, 코드 블록 또는 블록이라고 부른다.

// 블록문
{
  var foo = 10;
  
}

조건문

조건문은 주어진 조건식의 평가 결과에 따라 코드 블록의 실행을 결정한다.

if (조건식) {
 // 조건식이 참이면 이 코드 블록이 실행됨
} else {
 // 조건식이 거짓이면 이 코드 블록이 실행됨
}

만일 조건식을 늘리고 싶다면 else if 문을 사용한다.

if (조건식1) {
 // 조건식1이 참이면 이 코드 블록이 실행됨
} else if (조건식2) {
 // 조건식2이 참이면 이 코드 블록이 실행됨
} else if (조건식3){
 // 조건식 3이 참이면 이 코드 블록이 실행됨
} else {
  // 조건식1,2,3이 모두 거짓이면 이 코드 블록이 실행된다
}

필자가 느낀 바론, else if의 depth 길이가 깊어질수록 코드의 가독성이 떨어진다고 생각한다.

switch 문

switch 문은 주어진 표현식을 평가하여 그 값과 일치하는 표현식을 갖는 case문으로 실행 흐름을 옮기며, 상황을 의미하는 표현식을 지정하고 콜론으로 마친다.

switch (표현식) {
  case 표현식1:
    switch 문의 표현식과 표현식1이 일치하면 실행될 문;
    break;
  case 표현식2:
    switch 문의 표현식과 표현식2가 일치하면 실행될 문;
    break;
  default:
    switch 문의 표현식과 일치하는 case 문이 없을 때 실행될 문;
}

아래 예제를 보자

// 월을 영어로 변환한다. (11 → 'November')
var month = 11;
var monthName;

switch (month) {
  case 1: monthName = 'January';
  case 2: monthName = 'February';
  case 3: monthName = 'March';
  case 4: monthName = 'April';
  case 5: monthName = 'May';
  case 6: monthName = 'June';
  case 7: monthName = 'July';
  case 8: monthName = 'August';
  case 9: monthName = 'September';
  case 10: monthName = 'October';
  case 11: monthName = 'November';
  case 12: monthName = 'December';
  default: monthName = 'Invalid month';
}

console.log(monthName); // Invalid month

위 switch 예제를 실행할 경우 'November'가 출력되지 않고 'Invalid month'가 출력된다.
이는 case 문으로 이동하여 실행한 것은 맞지만, switch문을 탈출 하지 않고 끝날때가지 모든 case, default문을 실행 했기 때문이며
이를 ["폴스루"]라 한다.
즉 다시말해 monthName 변수에 'November'가 할당 된 후 탈출하지 않고, 'December'가 재할당 되고 마지막으로 'Invalid month'가 할당된 것이다.

이러한 문제는 case문 마지막에 break;문을 사용하지 않았기 때문에 발생된 문제인데 break 문은 코드 블록에서 탈출하는 역활을 한다.
만일 이 키워드를 사용하지 않을 경우 실행 흐름이 다음 case문으로 이동하여 탈출하지 않게 된다.
즉 올바르게 사용하고 싶다면 case문 문의 마지막에 break문을 달아주자.

// 월을 영어로 변환한다. (11 → 'November')
var month = 11;
var monthName;

switch (month) {
  case 1: monthName = 'January'; break;
  case 2: monthName = 'February'; break;
  case 3: monthName = 'March'; break;
  case 4: monthName = 'April'; break;
  case 5: monthName = 'May'; break;
  case 6: monthName = 'June'; break;
  case 7: monthName = 'July'; break;
  case 8: monthName = 'August'; break;
  case 9: monthName = 'September'; break;
  case 10: monthName = 'October'; break;
  case 11: monthName = 'November'; break;
  case 12: monthName = 'December'; break;
  default: monthName = 'Invalid month'; break;
}

console.log(monthName); // November

정상적으로 'November'가 출력된다.

반복문

반복문은 조건식의 평가 결과가 참인 경우 코드 블록을 실행한다.
자바스크립트에선 세 가지 반복문을 제공하며 아래와 같다.

for문, while문, do...while문

// for문
for (변수 선언문 또는 할당문; 조건식; 증가 및 증감){
  조건식이 참인 경우 해당 코드 블록을 반복 실행한다.
}


// i의 값이 2 보다 작다면 i의 값을 계속 증가한다.
for (var i=0; i < 2; i++) {
  console.log(i)
}

0
1

중첩 for문

// for문 내 for문을 중첩해 사용할 수 있으며 이를 중첩 for문이라 한다.

for (var i=1; i <=6; i++) {
  for(var j=1; j <=6; j++){
    if(i + j === 6) console.log(`[${i}, ${j}]`);
  }
}

while 문

while문은 주어진 조건식의 평가 결과가 참이면 코드 블록을 계속해서 반복 실행한다.
for문과의 차이점이 서로 명확하기 때문에 적절한 상황에 맞춰서 사용해야한다

for문 : 반복 횟수가 명확할 때 주로 사용한다.
while문 : 반복 횟수가 불명확할때 주로 사용한다.

var count = 0;

while (count < 3) {
  console.log(count); // 0 1 2
  count++;
}

// 무한루프
while (true) {console.log(1)}

// 만일 무한루프에서 탈출하고 싶다면 switch문에서 배운 break문을 사용하면 된다.

var count = 0;

while(true) {
  console.log(count);
  count++;
  
 if(count === 5) break;
 // 0 1 2 3 4 
}

do...while 문

do...while 문은 코드 블록을 먼저 실행하고 조건식을 평가한다.
따라서 코드 블록은 무조건 한 번 이상 실행된다.

var count = 0;

do {
  console.log(count); // 0 1 2
  count++;
}while(count < 3);