Table Of Contents
안녕하세요 이정환입니다 😃
이번 시간에는 타입 정의를 마치 변수처럼 하게 해주는 타입 별칭이라는 문법과 함께 이전 시간에 배운 객체 타입을 좀더 유연하게 정의하도록 도와주는 인덱스 시그니처라는 문법도 배워보겠습니다.
이번 시간의 실습은 chapter4.ts에서 함께합니다.
타입 별칭(Type Alias)
타입 별칭을 이용하면 다음과 같이 변수를 선언하듯 타입을 별도로 정의할 수 있습니다.
코드를 불러오는 중 입니다 ...type 타입_이름 = 타입 형태로 타입을 정의합니다. 위 코드는 타입 이름으로는 User 그리고 타입으로는 여러개의 프로퍼티가 있는 객체 타입을 정의했습니다. 이렇게 만든 타입 별칭은 다음과 같이 변수의 타입을 정의할 때 타입 주석과 함께 이용할 수 있습니다.
코드를 불러오는 중 입니다 ...참고로 동일한 스코프에 동일한 이름의 타입 별칭을 선언하는 것은 불가능합니다. 마치 변수 선언과 유사합니다.
코드를 불러오는 중 입니다 ...그러나 스코프가 다르다면 다음과 같이 중복된 이름으로 여러개의 별칭을 선언해도 상관 없습니다.
코드를 불러오는 중 입니다 ...test 함수 내부에서는 User가 string 타입이 되고 test 함수 바깥에서는 User가 객체 타입이 됩니다.
이전 시간에 타입 관련 문법은 컴파일과 함께 모두 사라진다고 살펴보았습니다. 타입 별칭 또한 타입 관련 문법이기 때문에 컴파일 결과 사라집니다. 다음은 chapter4.ts를 tsc로 컴파일 한 결과입니다.
코드를 불러오는 중 입니다 ...인덱스 시그니처(Index Signature)
인덱스 시그니쳐는 객체 타입을 유연하게 정의할 수 있도록 돕는 특수한 문법입니다.
다양한 국가들의 영어 코드를 저장하는 객체가 하나 있다고 가정합니다.
코드를 불러오는 중 입니다 ...만약 이때 countryCodes에 100개의 프로퍼티(국가 코드)가 추가 되어야 한다면 타입 정의에도 각 프로퍼티를 모두 정의해주어야 하기 때문에 매우 불편할 것 입니다.
코드를 불러오는 중 입니다 ...바로 이럴때 인덱스 시그니쳐를 이용하면 다음과 같이 간단하게 타입을 정의할 수 있습니다.
코드를 불러오는 중 입니다 ...[key : string] : string 은 인덱스 시그니쳐 문법으로 이 객체 타입에는 key가 string 타입이고 value가 string 타입인 모든 프로퍼티를 포함된다 라는 의미입니다. 따라서 Korea : “ko”나 Brazil : “bz” 처럼 key와 value가 모두 string 타입인 이런 프로퍼티들 이 타입에 자동으로 모두 포함됩니다. 굳이 일일이 이런 타입들을 직접 명시할 필요가 없습니다.
만약 국가 코드를 숫자로 보관하는 객체가 하나 더 필요하다고 하면 그때의 타입은 다음과 같이 정의하면 됩니다.
코드를 불러오는 중 입니다 ...또 이때 반드시 포함해야 하는 프로퍼티가 있다면 다음과 같이 직접 명시해도 됩니다.
코드를 불러오는 중 입니다 ...한가지 주의할 점은 인덱스 시그니쳐를 사용하면서 동시에 추가적인 프로퍼티를 또 정의할 때에는 인덱스 시그니쳐의 value 타입과 직접 추가한 프로퍼티의 value 타입이 호환되거나 일치해야 합니다. 따라서 다음과 같이 서로 호환되지 않는 타입으로 설정하면 오류가 발생합니다.
코드를 불러오는 중 입니다 ...string 타입은 number 타입과 호환되지 않기 때문입니다. 호환에 대해서는 3섹션에서 자세히 다룹니다. 그러니 지금은 일단 두 타입이 일치하도록 정의해야 한다고만 알아두어도 괜찮습니다.