타입 추론

김동현·2022년 4월 11일
0

TypeScript

목록 보기
5/18
post-thumbnail

타입 추론

타입스크립트는 "타입 추론(type inference)"라는 내장 기능을 통해 명시적으로 타입을 선언하지 않아도 타입이 추론됩니다.

모든 변수에 타입을 선언하는 것은 비생상적이며 타입이 추론되는 경우 명시적 타입 구문은 작성하지 않고 타입이 추론되도록 합니다.

타입이 추론되는 대표적인 상황은 아래와 같습니다.

  • 변수 선언시 초기값에 의해 타입 추론

  • 객체의 프로퍼티 값에 의한 타입 추론

  • 함수의 반환값 타입 추론

  • 함수의 매개변수 기본값에 의한 타입 추론

  • ES6 메서드 내 this에 바인딩될 객체의 타입 추론

원시 타입

let 키워드로 선언한 number 변수는 초기값 10에 의해 number 타입으로 추론됩니다.

이때 const 키워드를 통해 상수로서 선언한 number1 변수는 number 타입보다 더 구체적인 10 이라는 리터럴 타입으로 추론됩니다.

이는 const 키워드로 선언한 변수와 원시 타입의 특징으로 const로 선언한 변수에 할당한 초기값은 재할당하여 변경할 수 없다는 특징으로 인해 타입스크립트가 10으로 리터럴 타입으로 추론 됩니다.

즉, 원시 타입의 경우 let 키워드로 선언한다면 "원시 타입"으로 추론되고, const 키워드로 선언되는 경우 "리터럴 타입"으로 추론됩니다.

객체 타입

위 코드에서 person 변수는 객체의 구조를 통해 타입 추론이 이루어집니다.

person 변수에 할당받는 객체의 프로퍼티 키와 값의 타입 쌍이 존재합니다.

각 프로퍼티는 재할당이 가능하기 때문에 "프로퍼티 타입은 let 키워드로 선언한 변수처럼 추론"합니다.

위 코드에서 name과 age 프로퍼티 값의 타입은 원시 타입인 string과 number 타입으로 타입이 추론된 것을 확인할 수 있습니다.


객체의 메서드, 즉 ES6 메서드의 경우에는 메서드 내 this에 바인딩될 객체가 자동적으로 추론되는 것도 확인할 수 있습니다.

객체 타입은 let, const, var 키워드 상관 없이 할당받는 객체의 구조를 통해 객체 타입이 추론됩니다.

배열 타입

위 코드에서 arr 변수의 타입은 : string[]으로 추론됩니다.
이는 하나의 타입으로 구성된 배열의 경우 : type[]으로 타입이 추론됩니다.


만약 배열의 요소가 하나의 타입이 아닌 여러 타입으로 구성된 경우에는 유니온 타입을 요소로 갖는 배열로 추론됩니다.

arr 변수의 타입은 : (string | number | boolean | { key: string; })[]으로 추론됩니다.

튜플 타입

튜플 타입은 추론되지 않습니다.

위 코드에서 address 변수의 타입이 : [string, number]로 추론되지 않고 : (string | number)][]로 추론됩니다.

만약 길이가 고정된 배열과 각 요소별로 타입을 지정할 필요가 있는 경우에는 튜플 타입을 명시적으로 지정해주어야 합니다.

❗️타입 명시하기

타입이 추론될 수 있는 경우라도 "객체 리터럴"과 "함수 반환값"에 대한 타입은 타입 명시해주는 것이 좋습니다.

반환값의 타입을 명시한다면 함수에 대해 더욱 명확하게 알 수 있으며, 명명된 타입을 사용할 수도 있습니다. 또한 반환 타입을 명시하면 더욱 직관적인 표현이 됩니다.

객체 리터럴의 경우에는 초과 프로퍼티 검사가 객체 리터럴을 할당하는 시점에 이루어져 타입 체커가 이를 확인하여 에러를 표시해주기 때문입니다.

profile
Frontend Dev

0개의 댓글