세번째, 유니언과 리터럴

"타입스크립트에서 해당 값을 바탕으로 추론을 수행하는 핵심 개념 !"

• 코드 정보에 입각한 추론을 해내는 개념 유니언과 내로잉

유니언(union) ?

값에 허용된 타입을 두 개 이상의 가능한 타입으로 확장하는 것

그리고 내로잉(narrowing) ?

값에 허용된 타입을 한 개 이상의 가능한 타입이 되지 않도록 좁히는것

3.1 유니언 타입

유니언이란? (자세히...)

정확히 어떤 타입인지 모르지만 두 개 이상의 옵션 중 하나라는 것을 잠재적으로 인식하고 코드를 처리하는 개념


🔎 참고1. 코드에서는 "|" 이런 수직선으로 두 개 이상의 타입을 구분해서 보여줌

그러니깐, 변수 frontendDeveloper의 타입은 undefined|(이거나)string일 수 있다 !

3.1.1 유니언 타입 선언

🤓유니언 타입, 그러면 언제쓰나요?

변수의 초깃값이 있더라도, 변수에 대한도 명시적 타입 애너테이션을 제공하는 것이 유용할 때 사용 !

3.1.2 유니언 속성

❗ 값이 유니언 타입일 떼, 유니언으로 선언한 모든 가능한 타입에 존재하는 멤버 속성에만 접근 가능(유니언 외 타입에 접근하려면? 타입 검사 오류 발생 !)
정리하자면, 유니언으로 선언한 모든 타입에 가능한 속성이어야 접근 가능 !

3.2 내로잉

유니언 타입으로 정의된 여러 타입 중 하나의 타입으로 된 값의 속성을 사용하기 위해 구체적인 타입 중 하나라는 것을 알리는 과정 !

• 타입가드(type guard) ? 타입을 좁히는데 사용할 수 있는 논리적 검사

3.2.1 값 할당을 통한 내로잉

• 값 할당을 통해 string타입으로 타입을 좁힘(내로잉 시킴)

3.2.2 조건 검사를 통한 내로잉

3.2.3 typeof 검사를 통한 내로잉

• 조건 검사를 통한 내로잉 방식과 형태가 유사

3.3 리터럴 타입

• 구체적인 버전의 원시타입
• 변수를 const로 선언하고, 직접 리터럴 값을 할당하면, 할당된 리터럴 값으로 유추

🔎 참고2. const로 선언하지 않는다면(= let으로 선언? let frontend: string으로 표시), 다시 변수 값에 할당을 해주면 동일한 효과 !

• frontend 변수 타입은 "string 타입" 임
• 하지만, "Gazero"라는 특별한 값이기도 함
• 따라서, frontend의 타입은 더 구체적인 "Gazero"임
• 즉, 특정 원싯값으로 알려진 타입이 리터럴 타입(하나의 문자열 "Gazero"만 나타냄)

3.3.1 리터럴 할당 가능성

• number, string 등 서로 다른 원시타입은 서로 할당되지 못한다.
• 이처럼, 0과 1이 동일한 원시타입이더라도 서로 다른 리터럴 타입은 할당할 수 없음
• 그러니깐, 리터럴 타입으로 string값인 "Gazero"를 선언하면서 할당했다면? 같은 string타입이라고 하더라도, "gayoung"을 할당할 수 없음 !

3.4 엄격한 null 검사

3.4.1 십억 달러의 실수

다른 타입이 필요한 위치에서 null 값을 사용하도록 허용하는 많은 타입 시스템을 가리키는 업계 용어

• 엄격한 null 검사 옵션 (StrictNullChecks)
• StrictNullChecks를 비활성화하면 코드의 모든 타입에 | null | undefined를 추가해야 모든 변수가 null 또는 undefined를 할당할 수 있다.
• 🚫 StrictNullChecks 옵션을 false로 설정하더라도, 타입이 완벽하다고 간주 될 수 없음 !! 엄격한 null 검사가 활성화되면 잠재적인 충돌을 확인 가능
  

3.4.2 참 검사를 통한 내로잉

• 자바스크립트에서 falsy로 정의된 값을 제외한 모든 값은 모두 참 !

falsy로 정의된 값

false
0
-0
0n
""
null
undefined
NaN

• 타입스크립트는 truthy로 확인된 일부에 한해서 타입을 좁힐 수 있음
  

3.4.3 초깃값이 없는 변수

• 자바스크립트에서 초깃값이 없는 변수는 기본적으로 "undefined"
• undefined를 포함하지 않는 타입으로 변수를 선언하고, 값을 할당하지 않은 상태에서 사용하려고 한다면?
  🚫 오류발생
  

3.5 타입 별칭

• 반복하기 불편한 긴 형태의 유니언 타입을 위해 타입별칭(type alias)를 만들 수 있음

type 새로운이름 = 타입;

3.5.1 타입 별칭은 자바스크립트가 아닙니다.

• 🚫 타입별칭은 순전히 타입 시스템에만 존재

3.5.2 타입 별칭 결합

• 가능 !
• 유니언 타입인 타입 별칭 내에 또 다른 유니언 타입인 타입 별칭을 포함하고 있다면, 다른 타입 별칭을 참조하는 것이 유용 !