본문 바로가기

Frontend/typescript

Typescript 배우기 8 (유틸리티 타입)

// 유틸리티 타입

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

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

const uk: UserKey = 'name'; // key값 중 하나 입력!

// partial<T>
let admin1: Partial<User> = {
  id: 1,
  name: 'Bob',
  age: 10,
  // 모든 key? 상태
  // job: "student", 없는 key error
};

// Required<T>
let admin2: Required<User> = {
  id: 2,
  name: 'Tom',
  age: 10,
  gender: 'f',
  // ?가 필수 프로퍼티가 됨
};

// Readonly<T>
let admin3: Readonly<User> = {
  id: 3,
  name: 'Kate',
  age: 10,
  gender: 'm',
};

// admin3.id = 4; error 수정 불가

//Record<K, T> K는 key!
function isValid(user: User) {
  const result: Record<keyof User, boolean> = {
    id: user.id > 0,
    name: user.name !== '',
    age: user.age > 0,
    gender: user.gender === 'm',
  };
  return result;
}

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

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

// Pick<T, K>
const customer1: Pick<User, "id" | "name"> = {
  // 필수
  id: 1,
  name: "Shin",
}

// Pick<T, K>
const customer2: Omit<User, "age" | "gender"> = {
  // 제외
  id: 1,
  name: "Shin",
}

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

// NonNullable<Type> undefined도 제외
type T3 = string | number | null | undefined;
type T4 = NonNullable<T3>; // string | number

// 그 외 유틸리티는 공식문서 참고!

https://www.youtube.com/watch?v=IeXZo-JXJjc&list=PLZKTXPmaJk8KhKQ_BILr1JKCJbR0EGlx0&index=8 

 

728x90