[모던 자바스크립트 Deep Dive] 08장 - 제어문

8장 도입

• 제어문: 조건에 따라 코드 블록을 실행(조건문)하거나 반복 실행(반복문)할 때 사용
• 일반적으로 코드는 위에서 아래 방향으로 순차적으로 실행
• 제어문을 사용하면 코드의 실행 흐름을 인위적으로 제어할 수 있음

⇒ 코드 흐름을 이해하기 힘들고 가독성을 해치는 단점

⇒ 추후에 살펴볼 고차 함수를 통해 제어문 사용을 억제하여 복잡성 해결

8.1 블록문

• 블록문: 0개 이상의 문을 중괄호로 묶은 것
• 코드 블록, 블록이라고 부르기도 함
• js는 블록문을 하나의 실행 단위로 취급
• 단독으로 사용할 수도 있으나 일반적으로 제어문이나 함수를 정의할때 사용
• 언제나 문의 종료를 의미하는 자체 종결성을 갖기 떄문에 블록문의 끝에는 세미콜론을 붙이지 않음

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

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

// 함수 선언문
function sum(a, b) {
  return a + b;
}

8.2 조건문

• 조건문: 주어진 조건식의 평가 결과에 따라 코드 블록(블록문)의 실행을 결정함
• 조건식은 불리언 값으로 평과될 수 있는 표현식

if … else 문

• 주어진 조건식의 평가 결과, 즉 논리적 참 또는 거짓에 따라 실행할 코드 블록을 결정
• 조건식이 불리언 값이 아닌 값이면 암묵적으로 불리언 값으로 강제 변환됨
• 문이 하나라면 중괄호 생략 가능
• 삼항 조건 연산자로 바꿔 쓸 수 있음
• 조건에 따라 단순히 값을 결정하여 변수에 할당하는 경우 삼항 조건 연산자를 사용하는게 가독성에 좋지만, 조건에 따라 실행해야 할 내용이 복잡하여 여러 줄의 문이 필요하다면 if … else 문을 사용하는 편이 가독성에 좋음

switch 문

• 주어진 표현식을 평가하여 그 값과 일치하는 표현식을 갖는 casw 문으로 실행 흐름을 옮김
• case 문은 상황을 의미하는 표현식을 지정하고 콜론으로 마침. 그 뒤에는 실행할 문들을 위치시킴
• 일치하는 case문이 없으면 default 문으로 이동
• switch 문의 표현식은 불리언 값보다는 문자열이나 숫자 값인 경우가 많음 ⇒ if … else 문은 논리적 참, 거짓으로 실행할 코드 블록을 결정, switch 문은 이보다는 다양한 상황(case)에 따라 실행할 코드 블록을 결정할 때 사용
• break문을 사용하여 코드 블록을 탈출할 수 있음
  • 이를 사용하지 않으면 연이어 값이 재할당됨

8.3 반복문

• 반복문: 조건식의 평가 결과가 참인 경우 코드 블록을 실행하고 조건식이 거짓일 때까지 반복

for 문

• 조건식이 거짓으로 평가될 때까지 코드 블록을 반복 실행

for ( 변수 선언문 또는 할당문 ; 조건식 ; 증감식){
 조건식이 참일 경우 반복 실행될 문;
}

• 변수 선언문, 조건식, 증감식은 모두 옵션이고, 어떤 식도 사용하지 않으면 무한루프가 됨

while 문

• 주어진 조건식의 평가 결과가 참이면 코드 블록을 계속해서 반복 실행
• 반복 횟수가 불명확할 때 주로 사용
• 조건식의 평가 결과가 불리언 값이 아니면 불리언 값으로 강제 변환
• 무한 루프에서 탈출하기 위해서는 코드 내에 if문으로 탈출 조건을 만들고 break문으로 코드 블록을 탈출

var count = 0;

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

do … while 문

• 코드 블록을 먼저 실행하고 조건식을 평가 → 코드 블록은 무조건 한 번 이상 실행됨

8.4 break 문

• 레이블 문, 반복문, switch 문의 코드 블록을 탈출함
• 레이블 문: 식별자가 붙은 문, 프로그램의 실행 순서를 제어하는 데 사용

// foo라는 레이블 식별자가 붙은 레이블 문
foo: console.log('foo');

• switch문의 case문과 default문도 레이블 문
• 레이블 문을 탈출하려면 break문에 레이블 식별자를 지정

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

console.log('Done!');

• 중첩된 for문의 내부 for문에서 break문을 실행하면 내부 for문을 탈출하여 외부 for문으로 진입, 이때 내부 for문이 아닌 외부 for문을 탈출하려면 레이블 문 사용

// outer라는 식별자가 붙은 레이블 for 문
outer: for (var i = 0; i < 3; i++) {
  for (var j = 0; j < 3; j++) {
    // i + j === 3이면 outer라는 식별자가 붙은 레이블 for 문을 탈출한다.
    if (i + j === 3) break outer;
    console.log(`inner [${i}, ${j}]`);
  }
}

console.log('Done!');

• 레이블 문은 중첩된 for 문 외부로 탈출할 때 유용하지만 그 밖의 경우에는 일반적으로 권장하지 않음
• 반복문, switch문에서는 break문에 레이블 식별자를 지정하지 않음

8.5 continue 문

• continue 문: 반복문의 코드 블록 실행을 현 지점에서 중단하고 반복문의 증감식으로 실행 흐름을 이동 시킴
• break 문처럼 반복문을 탈출하지는 않음