[TypeScript] object index signatures

2022. 9. 8. 16:19·TypeScript/기초
반응형

object 자료에 타입을 미리 만들어주고 싶은데, 어떤 속성들이 들어올 수 있는지 모르거나, 타입 지정할 속성이 

너무 많은 경우에는 index signatures를 사용하면 편하게 가능하다. 

 

index signatures

interface stringOnly {
    [key :string] :string
}

let obj :stringOnly = {
    name :'kim',
    age :'20',
    location :'seoul'
}

StringOnly라는 interface를 만들었다. 

특이한 점으로 속성으로 [ key :string] : string 이라고 정의가 되어있다. 이렇게 정의하면

" 모든 string으로 들어오는 key값에 할당되는 value는 string이어야 한다. " 라는 타입이 된다. 

 

즉, { 모든 속성 : string } 과 동일하다. 

 

interface StringOnly {
  age : number,   ///에러
  [key: string]: string,
}

interface StringOnly {
  age : number,   ///가능  
  [key: string]: string | number,
}

[]를 사용한 문법은 다른 속성과 함께 사용할 수 있지만,

모든 string key는 string 속성이라는 뜻과 "age" 는 number라는 논리적으로 말이 되지 않는 경우에는 에러가 발생한다. 

 

 

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

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

[TypeScript] implements 키워드  (1) 2022.07.13
[TypeScript] d.ts  (2) 2022.07.12
[TypeScript] Declare & Ambient Module  (1) 2022.07.11
[TypeScript] Tuple Type  (2) 2022.07.10
[TypeScript] React에서 사용하기_2편  (1) 2022.07.10
'TypeScript/기초' 카테고리의 다른 글
  • [TypeScript] implements 키워드
  • [TypeScript] d.ts
  • [TypeScript] Declare & Ambient Module
  • [TypeScript] Tuple Type
잉여개발자
잉여개발자
풀스택 개발자를 목표로 잉여롭게 개발 공부도 하면서 다양한 취미 생활도 즐기고 있는 잉여 개발자입니다.
  • 잉여개발자
    잉여로운 개발일지
    잉여개발자
    • 분류 전체보기 (789)
      • 개발정보 (36)
      • 개발환경 (7)
      • 개발생활 (19)
      • React (141)
        • 이론 (23)
        • 기능 (12)
        • 실험실 (88)
        • 버그 (6)
        • 패스트캠퍼스 (9)
        • Npm (3)
      • React Native (28)
        • 공통 (6)
        • TypeScript (3)
        • JavaScript (18)
        • 버그 (1)
      • Next.js (30)
        • 이론 (13)
        • 실험실 (13)
        • 버그 (3)
      • Web (35)
      • 알고리즘 (202)
        • 풀이 힌트 (39)
      • JavaScript (47)
      • TypeScript (29)
        • 기초 (27)
        • 실험실 (2)
      • Node.js (13)
        • 이론 (0)
        • 기능 (3)
        • 실험실 (9)
        • 버그 (1)
      • 도커 (4)
      • CCNA (22)
        • 이론 (4)
        • 문제 (18)
      • 취미생활 (167)
        • 잉여로운 칵테일 (2)
        • 잉여의 식물키우기 (130)
        • 잉여로운 여행기 (11)
        • 잉여의 제2외국어 (21)
        • 잉여로운 책장 (2)
      • Java (1)
        • Java의 정석 (1)
      • 꿀팁 공유 (3)
  • 태그

    프로그래머스
    next.js
    ReactNative
    javascript
    react
    영어독학
    ChatGPT
    Docker
    Node.js
    자바스크립트
    식물
    덤프
    리액트
    typescript
    영어회화
    CCNA
    바질
    redux
    네이버 부스트캠프
    리얼학습일기
    CSS
    리얼클래스
    타일러영어
    타입스크립트
    webpack
    다이소
    네트워크
    Babel
    바질 키우기
    알고리즘
  • hELLO· Designed By정상우.v4.10.1
잉여개발자
[TypeScript] object index signatures
상단으로

티스토리툴바