본문 바로가기
Language & Library/JS & TS

[TypeScript] 재귀적인 타입 선언 (recursive type)

by 미네마네모 2020. 12. 10.

아래와 같은 재귀적인 데이터 구조를 원했다.

const data = [
  { label: '기본', value: 'basic' },
  {
    label: '시간',
    sub: [
      { label: '월별', value: 'month' },
      { label: '주별', value: 'week' },
      { label: '일별', value: 'day' },
    ],
  },
  {
    label: '지역',
    sub: [
      { label: '시별', value: 'si' },
      { label: '군/구별', value: 'gun-go' },
      { label: '동별', value: 'dong' },
    ],
  },
  { label: '유형', value: 'kind' },
]

이러한 재귀적인 구조에는 아래와 같이 type을 선언해주면 된다.

type DataType = {
  label: string
  value?: string
  sub?: Array<DataType>
}

type DataInterface = Array<DataType>

const data: DataInterface = [
  { label: '기본', value: 'basic' },
  {
    label: '시간',
    sub: [
      { label: '월별', value: 'month' },
      { label: '주별', value: 'week' },
      { label: '일별', value: 'day' },
    ],
  },
  {
    label: '지역',
    sub: [
      { label: '시별', value: 'si' },
      { label: '군/구별', value: 'gun-go' },
      { label: '동별', value: 'dong' },
    ],
  },
  { label: '유형', value: 'kind' },
]

댓글