Object(객체)에서 여러가지 타입을 지정해야 하는 경우 [key: type]

2023. 12. 18. 00:27·기술/TypeScript

 

객체에 대한 타입을 지정해야하는 경우,

const 이름: PositionType = {
  name: "김사과",
  age: "12",
};

 

각각 해당 key와 value에 맞는 타입을 지정해줄 수 있다.

//타입으로 선언
type PositionType = {
  name: string;
  age: string;
};

const 이름: PositionType = {
  name: "김사과",
  age: "12",
};

//인터페이스로 선언
interface PositionType {
  name: string;
  age: string;
}

const 이름: PositionType = {
  name: "김사과",
  age: "12",
};

 

하지만 만약 지정해야 되는 타입이 너무 많고, 모든 key와 value의 타입이 동일하다면 다음과 같이 표현할 수 있다.

//만약 지정해야될 타입이 너무 많을 경우
type PositionType = {
  [key: string]: string;
};

 

인덱싱 가능한 타입(indexable type)이라고도 한다.

이 타입을 사용하면 객체의 프로퍼티 이름과 값에 대한 타입을 동적으로 확장할 수 있다.

저작자표시 비영리 변경금지 (새창열림)

'기술 > TypeScript' 카테고리의 다른 글

여러 타입을 만족하는 하나의 타입, 타입 합치기(Intersection Type, union/&)  (1) 2023.12.19
readonly 타입 설정, 불변성을 갖도록 만들기  (0) 2023.12.19
타입 축약과 타입의 확정 (Type Aliases 별칭, Narrowing, Assertion)  (1) 2023.12.18
기본 타입 정리(primitive types), 한 변수에 여러 타입 지정(union), array 전용 타입(tuple), 선택적 타입(optional), 함수 타입(기본, void, never), class 타입  (1) 2023.11.26
타입스크립트 사용 목적과 설정 방법  (0) 2023.11.26
'기술/TypeScript' 카테고리의 다른 글
  • readonly 타입 설정, 불변성을 갖도록 만들기
  • 타입 축약과 타입의 확정 (Type Aliases 별칭, Narrowing, Assertion)
  • 기본 타입 정리(primitive types), 한 변수에 여러 타입 지정(union), array 전용 타입(tuple), 선택적 타입(optional), 함수 타입(기본, void, never), class 타입
  • 타입스크립트 사용 목적과 설정 방법
빔네모
빔네모
console.log("빔네모")
  • 빔네모
    bimnemo("개발")
    빔네모
  • 전체
    오늘
    어제
    • 기록 (143)
      • 기술 (36)
        • JavaScript (1)
        • TypeScript (9)
        • React.js (10)
        • Next.js (0)
        • 라이브러리,도구 (3)
        • HTML,CSS (4)
        • CS (5)
        • BE (4)
      • 개발 (95)
        • 프로젝트 (0)
        • 트러블슈팅 (5)
        • 알고리즘(코딩테스트) (90)
      • 정보 (4)
      • 취미 (8)
        • 감상 (8)
  • 인기 글

  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
빔네모
Object(객체)에서 여러가지 타입을 지정해야 하는 경우 [key: type]
상단으로

티스토리툴바