📌 08장 제어문

8.1 블록문

블록문은 0개 이상의 문을 중괄호로 묶은 것으로 자바스크립트에서는 블록문을 하나의 실행단위로 취급한다.

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

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

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

8.2 조건문

조건문은 주어진 조건식의 평가 결과에 따라 코드 블록의 실행을 결정한다. 자바스크립트는 if-else문과 switch 문 두가지 조건문을 제공한다.

8.2.1 if-else문

조건식의 개수에 따라 코드 블록을 늘리고 else if문을 사용하면 된다. 또한 대부분의 if-else문은 삼항 조건 연산자로 바꾸어 사용할 수 있다.

  var num = 2;
  var kind;

  // if 문
  if(num > 0) {
      kind = '양수';      // 음수를 구별할 수 없다.
  }
  console.log(kind);      // 양수

  // if...else 문
  if(num > 0) {
      kind = '양수';    
  }
  else {
      kind = '음수';      // 0은 음수가 아니다.
  }
  console.log(kind);      // 양수

  // if...else if 문
  if(num > 0) {
      kind = '양수';    
  }
  else if(num < 0){
      kind = '음수';      // 0은 음수가 아니다.
  }
  else {
      kind = '영';
  }
  console.log(kind);      // 양수

8.2.2 switch문

switch문은 주어진 표현식을 평가하여 그 값과 일치하는 표현식을 갖는 case 문으로 실행 흐름을 옮긴다. switch문의 표현식과 일치하는 case문이 없다면 default 문으로 이동한다. default 문에서 break문을 생략하는것이 일반적이다.

  // 월을 영어로 변환한다. (11 -> 'November')
  var month = 2;
  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);     // February;

🧐 폴 스루(fall through) 란?

switch 문을 탈출하지 않고 switch문이 끝날 때까지 모든 case 문과 default 문을 실행되는것을 뜻한다. 아래 예제에서는 monthName 변수에 값이 계속 재할당되어 Invalid month가 출력된다

// 월을 영어로 변환한다. (11 -> 'November')
var month = 2;
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);     // Invaild month

8.3 반복문

반복문은 조건식의 평가 결과가 참인 경우 코드 블록을 실행한다 자바스크립트는 세가지 반복문인 for 문, while 문, do-while 문을 제공한다.

8.3.1 for 문

for 문은 조건식이 거짓으로 평가될 때까지 코드 블록을 반복 실행한다. for 문의 변수 선언문, 조건식, 증감식은 모두 옵션이므로 반드시 사용할 필요는 없다. for문의 실행순서는 다음과 같다.

• for 문을 실행하면 맨 먼저 변수 선언문 var i = 0 이 실행된다. 변수 선언문은 단 한 번만 실행된다.

• 변수 선언문의 실행이 종료되면 조건식이 실행된다. 현재 i 변수의 값은 0이므로 조건식의 평가 결과는 true이다.

• 조건식의 평가 결과가 true이므로 코드 블록이 실행된다. 증감문으로 실행 흐름이 이동하는 것이 아니라 코드 블록으로 실행 흐름이 이동하는 것에 주의하자.

• 코드 블록의 실행이 종료되면 증감식 i++가 실행되어 i 변수의 값은 1이 된다.

• 증감식 실행이 종료되면 다시 조건식이 실행된다. 변수 선언문이 실행되는 것이 아니라 조건식이 실행된다는 점에 주의하자. (앞에서 설명했지만 변수 선언문은 단 한번만 실행된다. 현재 i 변수의 값은 1이므로 조건식의 평가 결과는 true이다.)

• 조건식의 평가 결과가 true 이므로 코드 블록이 다시 실행된다.

• 코드 블록의 실행이 종료되면 증감식 i++가 실행되어 i변수의 값은 2가 된다.

• 증감식 실행이 종료되면 다시 조건식이 실행된다. 현재 i 변수의 값은 2이므로 조건식의 평가 결과는 false다. 조건식의 평가결과가 false이므로 for문의 실행이 종료된다.

8.3.2 while 문

while 문은 주어진 조건식의 평가 결과가 참이면 코드 블록을 계속해서 반복 실행한다. for 문은 반복 횟수가 명확할 때 주로 사용하고 while 문은 반복 횟수가 불명확할 때 주로 사용한다.

8.3.3 do-while 문

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

8.4 break 문

break 문은 레이블 문, 반복문 또는 switch 문의 코드 블록을 탈출한다. 레이블 문이란 식별자가 붙은 문을 말한다.

  // 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문 외부로 탈출할 때 유용하지만 그 밖의 경우에는 일반적으로 권장하지 않는다. 레이블문을 사용하면 프로그램의 흐름이 복잡해져서 가독성이 나빠지고 오류를 발생시킬 가능성이 높아진다.

8.5 continue 문

continue 문은 반복문의 코드 블록을 현 지점에서 중단하고 반복문의 증감식으로 실행 흐름을 이동시킨다.

  var string = 'Hello world';
  var search = 'l';
  var count = 0;

  // 문자열은 유사 배열이므로 for 문으로 순회할 수 있다.
  for(var i = 0; i < string.length; i++){
    // 'l' 이 아니면 현 지점에서 실행을 중단하고 반복문의 증감식으로 이동한다.
    if(string[i] !== search) continue;
    count++;
  }
  console.log(count); // 3

  // 참고로 String.prototype.match 메서드를 사용해도 같은 동작을 한다.
  const regexp = new RegExp(search, 'g');
  console.log(string.match(regexp).length);  // 3