[TS] keyof / Mapped Types / infer 등

 

 

 

 

---

 

 

 

 

 

---

keyof

 

 

✔️ keyof

   : Object 타입에 사용하면 object 타입이 가지고 있는 모든 key 값을 union type으로 합쳐서 내보내준다.

     object의 key를 봅아서 새로운 타입을 만들고 싶을 때 사용한다.

interface Person {
  age: number;
  name: string;
}

type PersonKeys = keyof Person;   //"age" | "name"
let a1: PersonKeys = "age";
let b1: PersonKeys = "agee";   //에러

[key : string]를 keyof 하면 stirng | number 타입이된다.

object key 값에 숫자를 넣어도 문자로 치환되기 때문에

( [key : number]는 typeof하면 number )

interface Person {
  [key :string]: number;
}
type PersonKeys = keyof Person;   //string | number 타입됩니다
let a :PersonKeys = 'age'; //가능
let b :PersonKeys = 'ageeee'; //가능

 

 

 

 

 

---

 

Mapped Types

 

 

object안에 있는 속성들을 다른 타입으로 한번에 변환하고 싶을 때 mapping해서 바꾼다.

 

[ 작명 in keyof 타입파라미터 ] : 원하는타입

 

type Bike = {
  color: boolean;
  model: boolean;
  price: boolean | number;
};

type TypeChanger<MyType> = {
  [key in keyof MyType]: string;
};

type 새로운타입 = TypeChanger<Bike>;

let obj55: 새로운타입 = {
  color: "red",
  model: "kia",
  price: "300",
};

 

 

 

---

 

 

 

 

조건부 타입

 

 

 

type if문은 extends 키워드와 삼항연산자를 이용한다.

"extends는 왼쪽이 오른쪽의 성질을 가지고 있냐"라는 뜻

type Age<T> = T extends string ? string : unknown;

 

 

 

ex) 파라미터로 array 자료 입력하면 array의 첫 자료의 타입을 그대로 남겨주고,

       array 자료아니라 다른걸 입력하면 any타입을 남겨주는 타입?

type FirstItem<T> = T extends any[] ? T[0] : any;

 

 

 

 

---

 

 

 

 

infer

 

 

infer : 입력한 타입을 변수로 만들어주는 키워드

  - 조건문 안에서만 사용가능하다.

  - infer 우측에 작명하면 타입을 T유추해서 작명한이름의 변수에 집어넣어라는 뜻이다.

 

[활용]

1.  array안에 있던 타입을 뽑아서 변수로 만들어 줄 수 있다.

type typeChange<T> = T extends (infer R)[] ? R : unknown;
         //T는 boolean[]이고 boolean만 뽑아서 R에 할당해준다.
type NewType = typeChange<boolean[]>;   // NewType 은 boolean 타입

 

2. 함수의 return 타입이 어떤 타입인지 뽑아서 변수로 만들어줄 수 있다.

type typeChange3<T> = T extends () => infer R ? R : unknown;
type NewType1 = typeChange3<() => number>; // NewType은 number 타입