TypeScript - Index Signature

💁🏻‍♀️ 소개

TypeScript의 인덱스 시그니처(Index Signature)는 객체의 속성 이름과 개수를 미리 알 수 없는 동적 속성에 대응하는 기능입니다.

❶ 인덱스 시그니처 기본 개념

인덱스 시그니처는 객체의 속성 키와 속성 값에 대한 타입을 명시적으로 정의하는 구문입니다.
인덱스 시그니처를 사용하면 객체의 속성 이름과 개수가 동적으로 변하는 경우에도 안전하게 타입 검사를 수행할 수 있습니다.

인덱스 시그니처 구문

인덱스 시그니처는 다음과 같은 구문으로 작성합니다.

interface IndexSignatureExample {
    [key: string]: number;
}

위 예시에서 [key: string]은 속성 키의 타입을 string으로 지정하고 있습니다.
이어서 : number 부분은 속성 값의 타입을 number로 지정하고 있습니다.

인덱스 시그니처 사용 예제

인덱스 시그니처를 사용한 인터페이스를 정의한 후, 해당 인터페이스를 타입으로 사용할 수 있습니다.

interface StringNumberDictionary {
    [key: string]: number;
}

let dictionary: StringNumberDictionary = {
    one: 1,
    two: 2,
    three: 3,
};

console.log(dictionary.one); // 출력: 1

인덱스 시그니처를 사용하면 객체의 속성에 동적으로 접근할 수 있으며, 속성 값의 타입이 올바른지 확인할 수 있습니다.

❷ 인덱스 시그니처 주의사항

인덱스 시그니처를 사용할 때 주의해야 할 사항이 있습니다.
인덱스 시그니처의 키 타입은 string 또는 number만 가능합니다.
동일한 인터페이스에서 여러 개의 인덱스 시그니처를 사용할 경우, number 타입 키의 인덱스 시그니처 값 타입은 string 타입 키의 인덱스 시그니처 값 타입의 하위 타입이어야 합니다.

📝 총정리

인덱스 시그니처를 사용하여 객체의 속성 키와 값에 대한 타입을 명시적으로 정의할 수 있으며, 이를 통해 안전하게 타입 검사를 수행할 수 있습니다.
인덱스 시그니처 구문은 [key: string]: number;와 같은 형태로 작성되며, 키 타입은 string 또는 number만 가능합니다.

인덱스 시그니처를 사용하면 객체의 속성에 동적으로 접근할 수 있고, 속성 값의 타입이 올바른지 확인할 수 있습니다.
하지만 인덱스 시그니처 사용 시 제약 사항을 주의해야 하며, 특히 인터페이스에서 여러 개의 인덱스 시그니처를 사용할 경우 값을 올바르게 설정해야 합니다.