Post

TypeScript 의 인터섹션

이전에, TypeScript 에서 사용할 수 있는 연산자 중 Union(유니온) 연산자에 대해 알아보았다.
유니온 연산자는 한 타입에서 2개 이상의 서로 다른 타입을 갖도록 만드는 연산자로, 일종의 합집합을 만들어주는 역할이었다.

이번에 다룰 인터섹션은, 교집합을 만들어주는 역할이다. 이에 대해 알아보도록 하자.

인터섹션(Intersection), ‘&’

바로 예시 코드를 보도록 하자.

1
2
3
4
5
6
7
8
9
10
11
12
type nev = string & number; // never

type A = string | boolean;
type B = boolean | number;
type C = A & B; // boolean

type D = {} & {string | null}; // string

type E = string & boolean; // never

type F = unknown | {}; // unknown
type G = never & {}; // never

각각 타입을 보게 되면, nev 는 string 과 number 의 교집합이다. 근데, 둘의 교집합이 존재할 수 있을까? 그렇지 않다.

둘은 교집합이 없고, 이는 공집합을 의미하는 것과같다. 그래서 nev 는 never 타입을 갖게된다. 타입 C 의 경우, string | boolean 과 boolean | number 의 교집합이니 boolean 이 되는 것이다.

타입 F 의 경우엔 unknown 과 {} 의 합집합이니, unknown 이 되고, 타입 G 는 never 와의 교집합이니, 반드시 never 가 된다.

그런데, 하나 짚고 넘어갈 것이 있다. {} 의 경우, non-nullish type 과 & 연산을 진행하면 never 가 되지 않는다.

1
2
3
type H = { a: 'b' } & number; // H = { a: 'b' } & number
type I = null & { a: 'b' }; // I = never
type J = {} & string; // J = string;

타입 H 를 보면, { a: ‘b’ } & number 로 지정이 되었다. 객체의 키는 a, 값은 ‘b’ 이며 동시에 숫자라는 것이다. never 가 되지 않는 것이 의아한데, 이는 추후 다룰 ‘브랜딩’ 기법에서 알아보도록 하자.

This post is licensed under CC BY 4.0 by the author.