TypeScript - Utility Types (유틸리티 타입)

oong·2022년 8월 12일
0

keyof

// keyof

interface User {
    id: number;
    name: string;
    age: number;
    gender: "m" | "f";
}

type UserKey = keyof User; // 'id' | 'name' | 'age' | 'gender'

const uk:UserKey = "name":

keyof를 사용하여 인터페이스 User에 있는 key 값들만 가져 올 수 있다. 변수 uk에는 UserKey에 해당하는 값들만 올 수 있다.

Partial< T >

Partial은 프러퍼티를 모드 optional하게 바꿔 준다 -> 일부만 사용하는게 가능

// keyof

interface User {
    id: number;
    name: string;
    age: number;
    gender: "m" | "f";
}

let admin: Partial<User> = {
    id: 1,
    name: "Bob",
};

Required< T >

모든 프러퍼티를 필수로 바꿔 준다.

interface User {
    id: number;
    name: string;
    age?: number;
}

let admin: Required<User> = {
    id: 1,
    name: "Bob",
};

위와 같이 인터페이스에서 age를 optional하게 선언했어도 Required를 사용하면 age는 필수 값이 된다.

Readonly< T >

프러퍼티를 읽기 전용으로 바꾼다.

interface User {
    id: number;
    name: string;
    age?: number;
}

let admin: Readonly<User> = {
    id: 1,
    name: "Bob",
};

admin.id = 4;

admin의 id 값은 변경할 수 없다.

Record<K, T> (K-key, T-type)

interface Score {
    "1": "A" | "B" | "C" | "D";
    "2": "A" | "B" | "C" | "D";
    "3": "A" | "B" | "C" | "D";
    "4": "A" | "B" | "C" | "D";
}

const score:Score = {
    1: 'A',
    2: 'B',
    3: 'A',
    4: 'C',
}

이 코드는

type Grade = "1" | "2" | "3" | "4";
type Score = "A"| "B"| "C"| "D"

const score:Record<Grade, Score> = {
    1: 'A',
    2: 'B',
    3: 'A',
    4: 'C',
}

위와 같이 Record를 사용하여 표현할 수도 있다.

interface User {
    id: number;
    name: string;
    age: number;
}

function isValid(user: User) {
    const result: Record<keyof User, boolean> = {
        id: user.id > 0,
        name: user.name ! == "",
        age: user.age > 0,
    };
    return result;
}

Record를 이렇게 활용할 수도 있다.

Pick<T, K>

T 타입에서 K 프러퍼티만 골라서 사용한다.

interface User {
    id: number;
    name: string;
    age: number;
    gender: "M" | "W";
}

const admin: Pick<User, "id" | "name"> = {
    id: 0,
    name: "Bob",
}

admin에서 User의 id, name 2개의 key 값만 가져 오고 싶을 때 이렇게 사용한다.

Omit<T, K>

Pick과 반대로 특정 프러퍼티를 생략하고 사용할 수 있다.

interface User {
    id: number;
    name: string;
    age: number;
    gender: "M" | "W";
}

const admin: Omit<User, "age" | "gender"> = {
    id: 0,
    name: "Bob",
}

Exclude<T1, T2>

Type1에서 Type2를 제외하고 쓰는 방식이다. Omit과 다른 점 -> Omit은 프러퍼티를 제거하고 Exclude는 타입을 제거한다.

type T1 = string | number;
type T2 = Exclude<T1, number>;

위와 같이하면 T2에는 string 타입만 남는다.

NonNullable< Type >

null과 undefined를 제외한 타입을 생성한다.

type T1 = string | null | undefined | void;
type T2 = NonNullable<T1>;

T2에는 string, void 타입만 남게 된다.

1개의 댓글

comment-user-thumbnail
2022년 8월 13일

자바스크립트 읽어라

답글 달기

관련 채용 정보