CH4. 제어문

4.1.1. if문 사용 시 타입 제약

• 참과 거짓을 판단할 수 있는 불리언(boolean) 타입
  • truthy: 아래 falsy한 상황 이외의 모든 상황
  • falsy:
    • undefined
    • null
    • 0
    • “”(null string)
    • NaN
      

• 조건 연산자

  • ||

  • &&

  • ??

    let x;
    
    x ??= 5;
    console.log(x); // 5
    
    x ??= 10;
    console.log(x); // 5 (이미 x에 값이 할당되어 있으므로, 10이 할당되지 않습니다.)

4.1.2. switch 문과 폴스루

• switch

  • default 절 없이 case 절로 커버하면 되지 않나?
    • default 절이 없을 경우, 예상 치 못한 case에 마주할 때, 오류가 발생할 수 있다.
  
  

• fall-through(폴스루)

  • break 문을 생략하여, 다음 case 절이 실행되는 상태

  • case 문 내에 break 문이 선언되지 않아 case 문이 종료되지 않고 다음 case 문이 이어서 실행되는 현상

  • 폴스루를 허용하지 않으려면 tsconfig.json에 “noFallthroughCaseInSwitch” 옵션을 아래와 같이 추가하면 된다.

    {
      "compilerOptions" : {
          "noFallthroughCasesInSwitch": true
     }
    }

  • 위와 같이 옵션을 true로 설정하더로도 case 절에 아무런 명령을 넣지 않을 경우 폴스루를 허용하게 된다.

    switch(sth) {
      case 0:  // 어떤 명령도 없음
      case 1:
          console.log("1");
          break;
    }

4.2.1. for 문과 이터러블 객체

• ES5의 for in 문

  • ES5 자바스크립트에서 배열이나 객체를 순회할 때 사용

  // 배열 순회
  let islands = ["jejudo", "dokdo"];
  
  for (let index in islands) { // index: 배열의 인덱스
      console.log(index, islands[index]); 
  }
  
  // 출력결과
  // 0 jejudo
  // 1 dokdo
  
  // 객체 순회
  let fruits = {"a": "apple", "b": "banana"};
  
  for (let property in fruits) {
      console.log(property, fruits[property]);
  }
  
  // 출력결과
  // a apple
  // b banana

• ES6의 for of 문

  • 인덱스를 이용해 값을 가져올 수 있는 for in 문과 달리 for of 문은 곧바로 값을 가져올 수 있다.
  • 이터러블(iterable)은 반복 가능한 객체인 배열, 문자열, DOM 컬렉션, 맵(Map)과 셋(Set) 등을 말한다.
  • iterable 객체는 “Symbol.iterator” 메서드를 가지고 있어서 반복(iteration)이 가능한 객체이다.
  • 하지만 js의 문자열은 실제로는 iterable 프로토콜을 따르지 않고, ‘Symbol.iterator’ 메서드를 직접 구현하지 않았다.
  • 그럼에도 불구하고 문자열은 Iterable 객체처럼 동작한다. 이는 내부적으로 JS 엔진이 문자열을 Iterable-like 하게 동작하도록 구현했기 때문이다.
  
  

  cf) Iterable-like 하게 만들어진 string
  

  

  
  

• 맵과 셋을 for of 문에 적용

  • 맵과 셋은 tsconfig.json 파일의 target 속성이 ES5 이면 컴파일되지 않는다.(ES5에 맵과 셋에 대응할만한 문법이 존재하지 않기 때문)
  • target 속성을 es2015로 설정해야 한다.

  cf) JS의 set을 array로 변경하는 예시 코드

    // 방법 1
    let set = new Set([1, 2, 3]);
    let array = [...set];
  
    // 방법 2
    let set = new Set([1, 2, 3]);
    let array = Array.from(set);

  
  

  cf) Map에서는 키(key)에 관련된 메서드가 많은 반면, Set에서는 값(value)에 대한 메서드가 많은 이유가 무엇인지
  

  

• Symbol.iterator 메서드를 이용한 이터러블 객체 사용

  • Symbol.iterator 메서드는 배열, 맵, 셋과 같은 이터러블 객체를 순회하는데 사용한다.
  • 새로운 이터러블 객체를 만들어 for of, for in 문에 적용하려면 Symbol.iterator 메서드를 이용해 이터러블 객체로 구현해야 한다.
  • 이 메서드는 반복문을 순회할 때마다 next() 메서드를 통해 순회 중인 객체를 반환한다.

  let arr = [1, 2];
  let itObj = arr[Symbol.iterator]();
  
  console.log(typeof itObj); // object
  console.log(itObj.next()); // {value: 1, done: false}
  console.log(itObj.next()); // {value: 2, done: false}
  console.log(itObj.next()); // {value: undefined, done: true}