이미 정의해 놓은 타입을 변환하여 간결한 문법으로 타입을 정의
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
타입스크립트 입문 - 기초부터 실전까지 - 장기효