keyof, object 타입 변환기

크롱·2023년 8월 2일
0

TypeScript

목록 보기
21/25

📒 keyof

key값을 전부 가져오는 keyof


자바스크립트에선 key를 배열로 뽑아주는 문법이있었죠
let obj = {name :'kim', age:20}
Object.keys(obj) // ['name','age']

추억회상------------------------------------------
-----------------------------------------------
  
  
interface Person {
	age : number,
  	name : string
}

keyof Person  // 'age'|'name' 리터럴 타입


type PersonKeys = keyof Person
let a :PersonKeys = 'age' ///ok
let b :PersonKeys = 'name' ///ok

🔍 index-signature 에 keyof



interface Person {
  [key: string]: number;
}

type Hi = keyof Person; //  string | number
let a: Hi = 2;
let b: Hi = 'hi';





📘 object 타입 변환기


가끔 object를 다른 타입으로 변환하고 싶을 때
ex. 모든 속성에 문자가 들어오는 타입 => 숫자가 들어오도록

그럴 땐 처음부터 타입을 다시 작성하는 것이 아니라 mapping을 이용하면 됩니다.

type Car = {
	color : boolean,
  	model : boolean,
  	price : boolean | number
}
boolean이 아닌, 전부다 string으로 바꿔야한다면

			 👇파라미터로 들어온 obj타입
type Changer<Type> = {
	[key in keyof Type] :string
  			👉파라미터로 들어온 obj타입의 key값 union으로
  			  =>'color' | 'model' | 'price'
  	
}

type New = Changer<Car>

----------------------------------------------
type New = {
	color: string;
  	model: string;
  	price: string;
}

[ 자유작명 in keyof 타입파라미터 ] : 원하는 타입
in 키워드는 왼쪽이 오른쪽에 들어있냐라는 뜻
keyof는 오브젝트 타입에서 key값만 union type으로 뽑아주는 역할


📓 문제

type Bus = {
  color : string,
  model : boolean,
  price : number
}
동료가 잘못 만든 타입입니다.
color, model, price 속성은 전부 string 또는 number 타입이어야합니다.

			 👇파라미터로 들어온 obj타입
type Changer<Type> = {
	[key in keyof Type] :string|number
  			
  	
}

type New = Changer<Bus>

object안에 들어있는 모든 속성을
string, number 이렇게 고정된 타입으로 변환해주는게 아니라
내가 원하는 타입을 입력하면 그걸로 변환해주는 범용성 좋은 변환기를 만들어보십시오.

type Bus = {
  color : string,
  model : boolean,
  price : number
}

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

type NewBus = TypeChanger<Bus, boolean>;
type NewBus2 = TypeChanger<Bus, string[]>

const hi: NewBus2 = {
  color: ['yellow','pink'],
  model:['kk','bmw'],
  price:['100','1000']
};
profile
👩‍💻안녕하세요🌞

0개의 댓글