[한 입 크기로 잘라먹는 TypeScript] CH3. 타입스크립트 이해하기 1(1. 타입은 집합이다, 2. 타입 계층도와 함께 기본타입 살펴보기)

chapter 3. 타입스크립트 이해하기

0. 타입스크립트를 이해한다는 것은?

타입스크립트가 어떤 기준으로 타입을 정의하고, 어떤 기준으로 타입들 간 관계를 정의하고, 어떤 기준으로 타입스크립트 코드의 오류를 검사하는지 그 원리와 동작 방식을 이해하는 것.

 

1. 타입은 집합이다

타입스크립트의 '타입'은 여러 개의 값을 포함하는 '집합'이다.

집합: 동일한 속성을 갖는 요소들을 하나의 그룹으로 묶은 단위

타입스크립트의 모든 타입들은 집합으로써 서로 포함하고 포함되는 관계를 갖는다.

이런 관계에서 다른 타입을 포함하는 타입을 슈퍼 타입(부모 타입)이라 부르며, 반대는 서브 타입(자식 타입)이라고 한다.

타입 간의 이러한 계층 관계를 어떻게 이용할 수 있는지 살펴보는 것이 중요하다.

 

✅ 타입 호환성

A와 B 두 개의 타입이 존재할 때, A 타입의 값을 B 타입으로 취급해도 괜찮은지 판단하는 것

- 만약 A 타입 값이 B 타입 값으로 취급되어도 괜찮다면 호환된다라 표현하고 안 된다면 호환되지 않는다고 한다.

Number 타입이 Number 리터럴 타입의 슈퍼 타입이므로, Number 리터럴 타입을 Number 타입으로 취급하는 것은 가능하나 Number를 Number 리터럴 타입으로 취급할 수는 없다.

업 캐스팅: 서브 타입의 값을 슈퍼 타입의 값으로 취급하는 것. 모든 상황에 가능

다운 캐스팅: 업 캐스팅의 반대. 대부분의 상황에 불가능

 

 

2. 타입 계층도와 함께 기본타입 살펴보기

타입 계층도

✅ unknown 타입 (전체 집합)

• 타입 계층도의 최상단에 위치 👉 unknown 타입은 모든 타입의 슈퍼 타입 / 반면 모든 타입은 unknown의 부분 집합
• 따라서 unknown 타입 변수에는 모든 타입의 값을 할당할 수 있다 👉 모든 타입은 unknown 타입으로 업 캐스트 할 수 있다

let a: unknown = 1;                 // number -> unknown
let b: unknown = "hello";           // string -> unknown
let c: unknown = true;              // boolean -> unknown
let d: unknown = null;              // null -> unknown
let e: unknown = undefined;         // undefined -> unknown
let f: unknown = [];                // Array -> unknown
let g: unknown = {};                // Object -> unknown
let h: unknown = () => {};          // Function -> unknown

• 다운 캐스트는 예외적인 경우가 아니면 허용되지 않는다 👉 unknown 타입의 값은 any를 제외한 어떤 타입의 변수에도 할당할 수 없다.

let unknownValue: unknown;

let a: number = unknownValue;
// 오류 : unknown 타입은 number 타입에 할당할 수 없습니다.

 

✅ never 타입 (공집합)

• 타입 계층도 최하단에 위치
• never 타입은 불가능, 모순을 의미하는 타입. 👉 공집합(아무것도 포함하지 않는 집합)을 뜻하는 타입
• 공집합은 모든 집합의 부분 집합. 즉, never 타입은 모든 타입의 서브 타입. 👉 따라서 never 타입은 모든 타입으로 업 캐스팅 가능

let neverVar: never;

let a: number = neverVar;            // never -> number
let b: string = neverVar;            // never -> string
let c: boolean = neverVar;           // never -> boolean
let d: null = neverVar;              // never -> null
let e: undefined = neverVar;         // never -> undefined
let f: [] = neverVar;                // never -> Array
let g: {} = neverVar;                // never -> Object

• 반면 어떤 타입도 never 타입으로 다운 캐스팅 할 수 없다.

let a: never = 1;                 // number -> never ❌
let b: never = "hello";           // string -> never ❌
let c: never = true;              // boolean -> never ❌
let d: never = null;              // null -> never ❌
let e: never = undefined;         // undefined -> never ❌
let f: never = [];                // Array -> never ❌
let g: never = {};                // Object -> never ❌

 

✅ void 타입

• 아무것도 반환하지 않는 함수의 반환값 타입으로 주로 사용된다
• void 타입은 undefined 타입의 슈퍼타입 👉 따라서 반환값을 void로 선언한 함수에서 undefined를 반환해도 오류가 발생하지 않는다. undefined 타입은 void 타입의 서브 타입이므로 업 캐스팅이 가능하기 때문.

function noReturnFuncA(): void {
  return undefined;
}

• void 타입의 서브 타입: undefined 타입, never 타입 👉 따라서 void 타입에는 undefined, never 이외에 다른 타입의 값을 할당할 수 없다.

let voidVar: void;

voidVar = undefined; // undefined -> void (ok)

let neverVar: never;
voidVar = neverVar; // never -> void (ok)

 

✅ any 타입 (치트키)

• 사실상 타입 계층도를 완전히 무시하는 치트키 같은 타입
• 모든 타입의 슈퍼 타입이 될 수도 있고 모든 타입의 서브 타입이 될 수도 있다.
• 모든 타입으로의 다운 캐스팅, 업 캐스팅이 가능하다.

 

---

출처

소개 - 한 입 크기로 잘라먹는 타입스크립트

한 입 크기로 잘라먹는 타입스크립트(TypeScript) | 이정환 Winterlood - 인프런