복잡한뇌구조마냥

타입스크립트(TS, TypeScript) 공부 6 본문

웹 개발 공부

타입스크립트(TS, TypeScript) 공부 6

지금해냥 2022. 12. 26. 13:29

28. keyof 연산자

- object 타입이 가지고 있는 모든 key 값을 union type으로 합쳐서 내보내줍니다.

- object의 키 이름을 가지는 literal type을 가짐

interface Person{
  age:number,
  name:string
}

type PersonKeys = keyof Person;  // "age" | "name" 타입
let a:PersonKeys ="name"; // 가능
let aa:PersonKeys = "hi"; // 불가능

 

29. Mapped Types

- Object 안에 있는 속성들을 다른 타입으로 일괄 변환할 때 유용

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

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

type StringCar = TypeChanger<Car>;

//type StringCar = {
//	color: string,
//	model: string,
//  price: string
//};

let obj :StringCar = {
  color: 'red',
  model : 'kia',
  price : '300',
}

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

- 동일한 속성명에 원하는 타입으로 변환

 

30. 조건부 타입

- extends 키워드와 삼항연산자를 이용한 타입 조건식

type Age<T> = T extends string ? string : unknown;
let age : Age<string> //age는 string 타입
let age2 : Age<number> //age는 unknown 타입

- T 타입이 string일 경우 string 타입을 반환하고, 그 외 unknown 타입을 반환

 

31. infer 키워드

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

type Person<T> = T extends infer R ? R : unknown; 
type 새타입 = Person<string>

- infer 키워드는 조건문 안에서만 사용 가능

- T에 해당하는 타입을 R이라는 변수에 집어넣는 키워드

- R은 T와 동일한 값을 가지므로 해당 구문의 경우 R은 string

 

type 타입추출<T> = T extends ( ()=> infer R ) ? R : unknown; 
type NewType = 타입추출< () => number >

- 다음과 같이 함수 형태로 만들어서 반환하는 값을 R로 사용도 가능

- 일정한 규칙보다 타입을 추출하는 키워드로 이해

LIST