[TS] TypeScript - Utility Types

Janet·2023년 1월 25일
0

TypeScript

목록 보기
7/8

1. keyof : Object의 Key를 가리킴.

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

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

const userkey :UserKey = "id";

2. Partial<T> : Property를 모두 'Optional'로 바꿔 줌.

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

let admin :Partial<User> = {
  id: 1,
  name: "Tom",
}
//위 Partial의 사용은 아래의 interface에서 option을 사용했을 경우와 같음
interface User {
  id?: number;
  name?: string;
  age?: number;
  gender?: "M" | "F";
}

3. Required<T> : Property를 모두 '필수 입력'으로 바꿔 줌.

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

//위 인터페이스에선 age의 속성은 optional이지만, Required를 사용하면 필수 입력으로 바뀜.
//따라서 age값을 입력하지 않으면 에러가 발생한다.
let admin :Required<User> = {
  id: 1,
  name: "Tom",
}

4. Readonly<T> : Property를 '읽기 전용'으로 바꿔 줌.

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

let admin :Readonly<User> = {
  id: 220,
  name: "Tom"
}

admin.id = 10; //읽기 전용이기에 수정 불가능.

5. Record<K,T> : 'K' = 'Key', 'T' = 'Type'

// 예제 1)
type Grades = "1" | "2" | "3" | "4";
type Scores = "A" | "B" | "C" | "D" | "F";

const score :Record<Grades, Scores> = {
  1 : "A",
  2 : "B",
  3 : "C",
  4 : "D",
}

// 예제 2) Interface와 Record 활용하기
interface Members {
  id : number;
  name : string;
  age : number;
} 

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

6. Pick<T,K> : Type에서 특정 Property만 골라 사용

// 예제) User인터페이스에서 id나 name만 Pick해서 사용 가능.

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

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

7. Omit<T,K> : 특정 Property를 제외/생략(omit)하고 사용 가능

// 예제) User인터페이스에서 age 혹은 gender property를 제외하고 사용

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

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

8. Exclude<T1,T2> : Type1에서 Type2를 제외하고 사용하는 방식.

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

9. NonNullable<Type> : Null과 Undefined를 제외한 타입을 생성.

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

0개의 댓글