[ Typescript 일지 ] - 오브젝트의 타입 -typeof, keyof

최문길·2023년 12월 23일
1

typescript 일지

목록 보기
2/5

typeof

typeof 연산자 : 객체 데이터를 객체 타입으로 변환해주는 연산자



우리가 알고 있는 객체

const obj = {
  name: 'choi',
  age: 30,
  married:false
}

type Obj = typeof obj

/*
type Obj = {
    name: string;
    age: number;
    married: boolean;
}
*/
let obj2 : Obj = {
  name: '피터파커',
  age: 18,
  married:false
}


함수도 결국 객체이기에..


const fn = (a:number)=> 0
type F = typeof fn
/*
type F = (a: number) => number
*/
const fn2:F = (a)=> a




keyof

keyof 연산자 : 객체 형태의 타입을 따로 속성들만 뽑아 모아 유니온 타입으로 만들어주는 연산자


type alias

type Type = {
   name: string;
   age: number;
   married: boolean;
}

type Union = keyof Type;
// type Union = name | age | married

const a:Union = 'name'; 
const b:Union = 'age';
const c:Union = 'married';

type Union에서 Type의 키 값들로만 이루어진 union타입인데 object에서 키 값은 string 기본적으로 string이다.

그러므로 literal type을 가진 타입이다.



as const

일반적인 object객체의 키값으로 이루어진 타입을 가지고 싶다면 as const



const circle = {
  type: 'radius',
  radius: 10
} as const // 값이 곧 타입인 리터럴 타입이다. 

type Shpae = typeof circle
/*
type Shape = {
  type : 'radius',
  radius : 10
}
*/

const sampleA : Shape = {
  type:'square', // 에러
  width: 10 // 에러
}
// Shape 타입 자체가 circle 전체이다. 
// 그러므로 
const sampleB : Shape = {
  type: 'radius', // good
  radius : 10  // good
}


object의 키값으로
이루어진 literal type을 가지고 싶다면


const circle = {
  type: 'radius',
  radius: 10
} as const // 값이 곧 타입인 리터럴 타입이다. 

type Key = keyof typeof circle

// type Key = 'type' | 'radius'


object의 value값으로 이루어진 literal type 을 가지고 싶다면

const circle = {
      type: 'circle',
      radius : 10,

    } as const
// circle에 as const를 붙였기에 

type Value =  typeof circle[keyof typeof circle];
// type Value = 'circle' | 10

0개의 댓글