Fall in IT.

Typescript Partial, Required, Pick 사용방법 본문

프로그래밍언어/Javascript & Typescript

Typescript Partial, Required, Pick 사용방법

D.Y 2018. 9. 17. 14:42
반응형
interface IPerson
{
name: string;
age: number;
gender: string;
}

/**
* 인터페이스의 모든 프로퍼티를 optional하게 변경한다.
*/
type PartialPerson = Partial<IPerson>;
const partialPerson: PartialPerson =
{
gender: "male" // optional
}

/**
* 인터페이스의 모든 프로퍼티를 required하게 변경한다.
*/
type RequiredPerson = Required<PartialPerson>;
const requiredPerson: RequiredPerson =
{
name: "Jade", // required
age: 29, // required
gender: "male" // required
}

/**
* 인터페이스의 프로퍼티중 일부(name, age)만 받도록 설정한다.
*/
type PickPerson = Pick<IPerson, "name" | "age">;
const pickPerson: PickPerson =
{
name: "Jade", // required
age: 29, // required
// gender: "male" --> (X)
}

/**
* 인터페이스의 프로퍼티중 일부(name,age)는 required
* gender는 optional로 받도록 설정한다.
*/
type PickPerson2 = Pick<IPerson, "name" | "age"> & Pick<Partial<IPerson>, "gender">;
const pickPerson2: PickPerson2 =
{
name: "Jade", // required
age: 29, // required
gender: "male" // optional
}



  • 특정 속성만 제거하는 방법
interface IPerson
{
name: string;
age: number;
gender: string;
}

type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;
type SubPartial<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;

type MyPerson = SubPartial<IPerson, "gender">;
let p: MyPerson;


반응형
Comments