
이미 정의해 놓은 타입을 변환하여 간결한 문법으로 타입을 정의

TypeScript는 공통 타입 변환을 용이하게 하기 위해 몇 가지 유틸리티 타입을 제공한다.
이러한 유틸리티들은 전역으로 사용 가능하며 그 종류는 다음과 같다.
<T>Partial은 특정 타입의 부분 집합을 만족하는 타입을 정의하며, 옵셔널 파라미터(?)를 사용하지 않아도 에러가 발생하지 않는다.
interface Person {
name: string;
age: number;
}
type UserInfo = Partial<Person>;
const human1: UserInfo = {}; // 가능
const human2: UserInfo = { name: 'mirrer' }; // 가능
const human3: UserInfo = { name: 'mirrer', age: 10 }; // 가능
<T>Readonly는 T의 모든 프로퍼티를 읽기 전용(readonly)으로 설정한 타입을 구성한다.
즉, 생성된 타입의 프로퍼티는 재할당 할 수 없고 오직 참조만 가능하다.
interface Person {
name: string;
}
const user: Readonly<Person> = {
name: 'mirrer',
};
user.name = 'change mirrer'; // Error
<K, T>Record는 K 타입을 key 값으로, T 타입을 value 값으로 갖는 형태의 타입을 생성한다.
주로 K 에 Union 문자열 값을 주어 map 형식의 타입을 만들 수 있고 여러 값들을 원하는 키값에 따라 분류할 때 유용하다.
interface Person {
name: string;
age: number;
}
const userList: Record<"Mirrer" | "Another", Person> = {
Mirrer: { name: "mirrer", age: 10 },
Another: { name: "another", age: 20 }
}
<T, K>Pick은 특정 타입에서 몇 개의 속성을 선택(pick)하여 타입을 정의한다.
T 는 대상타입, K 는 선택할 속성을 의미한다.
interface Person {
name: string;
age: number;
city: string;
}
const user: Pick<Person, 'name'> = {
name: 'mirrer',
};
<T, K>Omit은 특정 타입에서 지정된 속성만 제거한 타입을 정의한다.
T 는 대상타입, K 는 제외할 속성을 의미한다.
interface Person {
name: string;
age: number;
city: string;
}
const user: Omit<Person, 'city'> = {
name: 'mirrer',
age: 20
}
<T, U>Exclude는 T 타입들 중 U 타입과 중복되는 타입을 제외한다.
type T1 = Exclude<"a" | "b" | "c", "a">; // "b" | "c"
type T2 = "A" | "B" | 1
type T3 = Exclude<T2 , string> ; // 1
<T, U>Extract 는 T 타입에서 U 타입과 중복되는 타입만을 선택한다.
type T1 = Extract<"a" | "b" | "c", "a", "f">; // "a"
type T2 = "A" | "B" | 1
type T3 = Extract<T2 , number> ; // 1
<T>NonNullable 은 T 타입에서 Null, undefined를 제외한 타입을 return 한다.
type T = NonNullable<string | number | undefined>; // string | number
<T>Parameters 는 함수의 파라미터를 Tuple[] 타입으로 return한다.
type T1 = Parameters<() => string>; // []
type T2 = Parameters<(s: string) => void>; // [string]
type T3 = Parameters<(<T>(arg: T) => T)>; // [unknown]
function typeCheck(arg: { a: number, b: string }): void
type T4 = Parameters<typeof typeCheck>; // [{ a: number, b: string }]
<T>ReturnType 는 함수 T 의 반환 타입으로 구성된 타입을 return한다.
type T1 = ReturnType<() => string>; // string
type T2 = ReturnType<(<T>() => T)>; // {}
type T3 = ReturnType<(<T extends U, U extends number[]>() => T)>; // number[]
declare function typeCheck(): { a: number, b: string }
type T4 = ReturnType<typeof typeCheck>; // { a: number, b: string }
<T>InstanceType 는 생성자로 초기화된 인스턴스 타입을 return한다.
type T1 = ReturnType<() => string>; // string
type T2 = ReturnType<(<T>() => T)>; // {}
type T3 = ReturnType<(<T extends U, U extends number[]>() => T)>; // number[]
let typeCheck = () => ({ a: 1 });
type T4 = ReturnType<typeof typeCheck>; // { a: number }
<T>Required는 T 의 모든 프로퍼티가 필수로 설정된 타입을 구성한다.
interface Numbers {
num1?: number;
num2?: number;
};
const num: Required<Numbers> = { num1: 5 }; // Error
TypeScript: JavaScript With Syntax For Types.
React TypeScript Tutorial for Beginners - Codevolution
타입스크립트 입문 - 기초부터 실전까지 - 장기효