타입 확장은 기존 타입을 사용해서 새로운 타입을 정의하는 것을 말한다. 기본적으로 타입스크립트에서는 interface 와 type 키워드를 사용해서 타입을 정의하고 extends , 교차 타입, 유니온 타입을 사용하여 타입을 확장한다.타입을 확장하면 중복된 코드를 줄일 수 있고 더 명시적인 코드를 작성할 수 있다.type BaseMenuItem = { itemName: string | null; itemImageUrl: string | null; itemAmount: number; stock: number | null;}type BaseCartItem = { quantity: number;} & BaseMenuItem;요구 사항이 늘어날 때마다 타입을 확장하여 새로운 타입을 정의할 수 있다. 예..
제네릭은 일반화된 데이터 타입으로 함수나 클래스 등의 내부에서 제네릭은 어떤 타입이든 될 수 있다.함수의 제네릭어떤 함수의 매개변수나 반환 값에 다양한 타입을 넣고 싶을 때 제네릭을 사용할 수 있다.function fn(arg: T): T { return arg;}호출 시그니처의 제네릭호출 시그니처는 타입스크립트의 함수 타입 문법으로 함수의 매개변수와 반환 타입을 미리 선언하는 것을 말한다. 타입 시그니처라고도 한다.호출 시그니처를 사용할 때 제네릭 타입을 어디에 위치시키는지에 따라 타입의 범위와 제네릭 타입을 언제 구체 타입으로 한정할지 결정할 수 있다.// foo를 사용할 때 타입을 명시함으로써 제네릭 타입을 구체 타입으로 한정interface foo { fn: (arg: T) => T;}// F..
교차 타입교차 타입을 사용하면 여러 가지 타입을 결합하여 하나의 단일 타입으로 만들 수 있다. 기존에 존재하는 다른 타입들을 합쳐서 해당 타입의 모든 멤버를 가지는 새로운 타입을 생성한다.& 를 사용해서 표기하며 결과물로 탄생한 단일 타입에는 타입 별칭을 붙일 수 있다.type ProductItem = { id: number; name: string; price: number; imageUrl: string; quantity: number;}type ProductItemWithDiscount = ProductItem & { discountAmount: number };유니온 타입유니온 타입은 타입 A 또는 타입 B 중 하나가 될 수 있는 타입을 말하며 A | B 같이 표기한다.함수 내부에서 qu..
문자열 템플릿 리터럴 타입을 이용하면 유연성을 유지하면서도 문자열 리터럴을 정의할 수 있다.템플릿 리터럴 타입을 이용해 사용자 정의 이벤트 시스템을 만들 때 모든 이벤트명을 “on”으로 시작하도록 이름 규칙을 정할 수 있다. (빈 문자열 포함)type EventName = `on${string}`; HTML의 헤딩 요소를 표현하는 문자열 타입을 정의할 수 있다.type Levels = 1 | 2 | 3 | 4 | 5 | 6;// "H1" | "H2" | "H3" | "H4" | "H5" | "H6"type Headings = `H${Levels}`;한 개의 매개변수 EventObject를 갖는 Callback 함수 타입을 정의한다. EventObject는 이벤트 정보의 값을 포함하는 제네릭 타입이다.모..
타입스크립트에서는 기존 타입에 기반해 새 타입을 만들 수 있으므로 파생형을 일일이 유지보수하지 않고 최신으로 유지할 수 있다. 대표적으로 Pick 과 Omit 헬퍼 타입이 있다.매핑된 타입 Pick 은 객체의 키 하위 집합을 가져다 선택한 키만을 포함하는 새 객체를 만든다.type Pick = { [P in K]: T[P];}type PersonName = Pick;type PersonStrings = Pick;Omit 은 포함하고 싶지 않은 프로퍼티 집합으로 매핑한다. 이를 통해 특정 프로퍼티를 제거할 수 있다.type Omit = { [P in Exclude]: T[P];}type PersonWithoutAge = Omit;프로퍼티 키를 매핑할 때 조건부 타입과 타입 어서션을..
