[JS Deep Dive] 8장. 제어문

• 제어문은 조건에 따라 코드 블록을 실행하거나 반복 실행할 때 사용한다.(조건문 또는 반복문)
• 코드의 실행 흐름을 이해하기 어렵게 만들 수 있기때문에 가독성이 떨어질 수 있다. ⇒ forEach, map, filter, reduce 등의 고차함수를 사용해 복잡성 해결하려 노력함

✅ 블록문

• 0개 이상의 문을 {중괄호}로 묶은 것으로 코드블록 또는 블록이라 부른다.
• 블록문을 하나의 실행 단위로 취급한다.

✅ 조건문

• 주어진 조건식의 평가 결과에 따라 코드블록의 실행을 결정한다.
• 조건식은 불리언 값으로 평가될 수 있는 표현식
• if… else문 / switch문

if… else문

• if…else 문은 주어진 조건식(불리언 값으로 평가될 수 있는 표현식)의 평가 결과, 즉 논리적 참, 거짓에 따라 실행할 코드 블록을 결정한다.
• 조건식의 평가 결과가 불리언 값이 아니면 불리언 값으로 강제 변환되어 논리적 참, 거짓을 구별한다.
• 코드블록내 문이 하나뿐이면 중괄호 생략가능
• 대부분은 삼항 조건 연산자로 바꿔 쓸수 있다.

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

if (num > 0)      kind = '양수';
else if (num < 0) kind = '음수';
else              kind = '영';

// 경우의 수가 3가지 일때 삼항연산자 사용시
var num = 2;
// 0은 false로 취급된다.
var kind = num ? (num > 0 ? '양수' : '음수') : '영';
console.log(kind); // 양수

switch 문

• 주어진 표현식을 평가하여 그 값과 일치하는 표현식을 갖는 case문으로 실행 흐름을 갖는다.

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

• 참, 거짓으로 실행할 코드블록을 결정하는 if…else와 달리 switch문은 “다양한 케이스”에 따라 실행할 코드블록을 결정한다.
• 올바른 스위치문을 실행하려면 break문이 필요하다
• break 문이 없다면 case 문의 표현식과 일치하지 않더라도 실행 순서는 다음 case 문으로 연이어 이동한다.
• default 문은 맨 마지막에 위치해 스위치문을 저절로 빠져나가므로 break 문을 생략하는 것이 일반적이다.
• 여러개의 케이스문을 하나의 조건으로 사용할 수도 있다.
  • case 1: case 3: case 5: case 7: case 8: case 10: case 12: days = 31; 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';
}

console.log(monthName); // November

✅ 반복문

• 반복문은 조건식의 평가 결과가 참인 경우 코드블록을 실행한다.
• for문, while문, do…while문
• 반복문을 대체할 수 있는 forEach, for..in, for…of문 등 다양한 기능도 있다.

for문

• 조건식이 거짓으로 평가될때까지 코드블록 반복실행
• for문 내 for문을 중첩해 사용 가능

for (초기화식; 조건식; 증감식) {
  조건식이 참인 경우 반복 실행될 문;
}

for (var i = 0; i < 2; i++) {
  console.log(i);
}
//0
//1

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

while문

• 주어진 조건식의 평가결과가 참이면 코드블록을 계속해서 반복 실행한다.
• 조건문의 평과 결과가 거짓이되면 코드블록을 종료한다.
• 조건식의 평가결과가 언제나 참이면 무한루프가 된다.
  • 무한루프를 탈출하기 위해서는 코드블록 내에 if문으로 탈출 조건을 만들어 break문으로 탈출한다.

	while	for
WHEN?	반복 횟수가 불명확할때 주로 사용	반복 횟수가 명확할때 주로 사용

var count = 0;
// count가 3보다 작을 때까지 코드 블록을 계속 반복 실행한다.
while (count < 3) {
  console.log(count);
  count++;
} // 0 1 2

var count = 0;
// 무한루프
while (true) {
  console.log(count);
  count++;
  // count가 3이면 코드 블록을 탈출한다.
  if (count === 3) break;
} // 0 1 2

do…while문

• 코드블록을 ‘먼저’ 실행하고 조건식을 평가한다. 이는 무조건 한번이상 실행된다는 것을 의미한다.

var count = 0;

// count가 3보다 작을 때까지 코드 블록을 계속 반복 실행한다.
do {
  console.log(count);
  count++;
} while (count < 3); // 0 1 2

✅ break문

• break문은 레이블문(식별자가 붙은 문), 반복문, switch문을 탈출하게끔 한다. 이 이외에 break문을 사용하면 SyntaxError(문법에러)가 발생한다. ⇒ if문에서 사용하면 에러 발생
• 중첩 for문에서 외부for문을 탈출하려면 레이블문을 사용해 탈출가능하다.
• 반복문을 더이상 진행하지 않아도 될때에도 불필요한 반복을 중단할 수 있다.

//if문 에러
if (true) {
  break; // Uncaught SyntaxError: Illegal break statement
}

//레이블문에서 사용예시
// foo라는 식별자가 붙은 레이블 블록문
foo: {
  console.log(1);
  break foo; // foo 레이블 블록문을 탈출한다.
  console.log(2);
}

console.log('Done!');

//중첩for문
// outer라는 식별자가 붙은 레이블 for 문
outer: for (var i = 0; i < 3; i++) {
  for (var j = 0; j < 3; j++) {
    // i + j === 3이면 외부 for 문을 탈출한다.
    if (i + j === 3) break outer;
  }
}

console.log('Done!');

✅ continue문

• continue문은 반복문의 코드블록 실행을 현시점에서 중단하고 반복문의 증감식으로 실행 흐름을 이동시킨다.
  • break문과 다르다. break문은 아예 반복문을 탈출하지만 continue는 탈출하지 않고 다음흐름으로 이동하는 것
• if 문 내에서 실행해야 할 코드가 길다면 들여쓰기가 한 단계 더 깊어지므로 continue 문을 사용하는 것이 가독성이 더 좋다.

// continue 문을 사용하지 않으면 if 문 내(들여쓰기안)에 코드를 작성해야 한다.
for (var i = 0; i < string.length; i++) {
  // 'l'이면 카운트를 증가시킨다.
  if (string[i] === 'l') {
    count++;
    /**
			 code
				...
						**/
  }
}

// continue 문을 사용면 if 문 밖에 코드를 작성할 수 있다.
for (var i = 0; i < string.length; i++) {
  // 'l'이 아니면 카운트를 증가시키지 않는다.
  if (string[i] !== 'l') continue;
  count++; // continue문이 실행되면 이 문은 실행되지 않는다.
  /**
			 code
				...
						**/
}