React(83) TypeScript - Record 란

 

 

Record 는 React v2.1 부터 도입된 유틸리티 타입이다. 요 녀석은 객체전용 타입이다.

 

Record 는 < K, T>  요렇게 두 개의 제네릭 타입을 받을 수 있다.

첫번째 제네릭 타입 K 는 key 의 타입이고, 두번째 제네릭 타입 T 는 value 값의 타입을 의미한다

type studentNames = Record<string, string>;
			     ↑       ↑
                   객체에서   키의 타입   값의 타입

 

 

쉽게 말해서 나는 객체 안의 값들을 전부 string 으로 사용하고 싶다.

Record 가 없었을 때는, 객체 프로퍼티 타입을 하나하나~~~~ string 이라고 적어줘야 했다.

type studentNames = {
  name1: string;
  name2: string;
  name3: string;
  name4: string;
};

 

 

하지만 Record 를 사용한다면 ? 아래와 같이 뿅하고 바로 사용할 수 있다.

Record 를 사용하면 한방에 묶어서 얘네들 타입은 string 이야 라고 말하는 것이 가능하다.

type studentNames = Record<
  'name1' | 'name2' | 'name3' | 'name4', // 키의 타입 or 연산자( | )로 키값들을 쫘~악 나열해주자
  string 				 // 요기는 위에 애들이 공통으로 가질 값의 타입 ^-^ 
>;