TypeScript

TypeScript 핸드북 8 - 타입 유추

JavaScript, TypeScript

타입 유추 (Type Inference)

소개

이 절에서는 TypeScript의 타입 유추에 대해 다룹니다. 즉, 우리는 타입의 유추가 일어나는 곳과 방법에 대해 논의할 것입니다.

기본사항

TypeScript에는 명시적 타입 표현이 아닌 경우 타입 유추를 사용하여 타입 정보를 제공하는 여러 부분이 있습니다. 예를 들어, 아래 코드에서

1
let x = 3;

변수 x의 타입은 number라고 유추할 수 있습니다. 이러한 종류의 유추는 변수와 멤버를 초기화하고, 파라미터 Default 값을 설정하고, 함수 리턴 타입을 결정할 때 발생합니다.

대부분의 경우 타입 유추는 간단합니다. 하지만 다음 섹션에서는 타입 유추의 미묘한 차이에 대해 살펴 보겠습니다.

가장 공통적인 타입

여러 가지 표현식에서 타입 유추가 이루어지면 그 표현식의 타입이 “가장 공통적인 타입(Best common type)”을 계산하는데 사용합니다.

1
let x = [0, 1, null];

위의 예제에서 x의 타입을 추론하기 위해서는 배열 각 요소 타입을 고려해야 합니다. 여기에서는 배열의 타입에 대한 두 가지 선택 사항인 number와 null이 있습니다. 가장 공통적인 타입 알고리즘은 각 후보 타입을 고려하고 다른 모든 후보와 호환되는 타입을 선택합니다.

제공되는 후보 타입 중에서 가장 공통적인 타입을 선택해야 하기 때문에 타입이 공통 구조를 공유하지만, 아래의 예제 처럼 모든 타입의 수퍼 타입이 하나도없는 경우가 있습니다.

1
let zoo = [new Rhino(), new Elephant(), new Snake()];

이상적으로, 우리는 zoo가 Animal[]로 유추되기를 원할 수 있습니다. 하지만, 배열에 정확히 Animal 타입의 객체가 없습니다. 그리고 TypeScript는 배열 요소 타입에 대한 추측은 하지않습니다. 이 문제를 해결하려면, 어떤 타입도 다른 모든 후보자의 수퍼 타입이 아닌 경우 명시적으로 타입을 제공해야 합니다.

1
let zoo: Animal[] = [new Rhino(), new Elephant(), new Snake()];

가장 공통 타입이 발견되지 않으면, 타입 유추의 결과는 빈 객체 타입 {}입니다. 이 타입은 멤버가 없으므로 any 프로퍼티을 사용하려고 하면 에러가 발생합니다. 이 결과는 객체의 타입을 암묵적으로 결정할 수 없는 경우에 타입 안전성을 제공하면서 여전히 Type-agnostic 수단으로 객체를 사용할 수 있습니다.

컨텍스트 타입

타입 유추는 TypeScript의 “다른 측면(Other direction)”에서도 작동합니다. 이를 “컨텍스트 타이핑(Contextual typing)”이라고 합니다. 컨텍스트 타입 지정은 표현식 타입의 위치에 의해 암시될 때 발생합니다.

1
2
3
window.onmousedown = function(mouseEvent) {
    console.log(mouseEvent.buton);  //<- Error
};

위의 코드에서 TypeScript의 Type checker는 타입 에러를 발생 하기위해 Window.onmousedown 함수의 타입을 사용하여 할당의 오른쪽에 있는 함수 표현식의 타입을 추론했습니다. 그렇게 해서 mouseEvent 파라미터의 타입을 유추할 수 있었습니다. 하지만 이 함수 표현식이 문맥적으로 입력된 위치에 있지 않으면 mouseEvent 매개 변수는 any 타입을 가지며 오류는 발생하지 않습니다.

컨텍스트 타입 지정 표현식에 명시적 타입 정보가 들어있는 경우, 컨텍스트 타입은 무시됩니다. 위의 예를 수정하면 아래와 같습니다.

1
2
3
window.onmousedown = function(mouseEvent: any) {
    console.log(mouseEvent.buton);  //<- 이제 에러가 발생하지 않습니다.
};

파라미터에 명시적 타입 Annotation이 있는 함수 표현식은 컨텍스트 타입을 대체합니다. 일단 그렇게 되면 컨텍스트 타입이 적용되지 않으므로 오류가 발생하지 않습니다.

컨텍스트 타이핑은 많은 경우 적용됩니다. 일반적인 경우 함수 호출에 대한 파라미터, 할당의 오른쪽 부분, 타입 어설션, 객체 및 배열 리터럴의 멤버, return 문이 포함됩니다. 컨텍스트 타입은 또한 가장 공통 타입의 후보 타입으로도 작용합니다.

1
2
3
function createZoo(): Animal[] {
    return [new Rhino(), new Elephant(), new Snake()];
}

이 예에서 가장 공통 타입은 Animal, Rhino, Elephant, 그리고 Snake의 네 가지 집합으로 이루어져 있습니다. 이 중에서 Animal을 가장 공통 타입의 알고리즘으로 선택할 수 있습니다.

이 내용은 나중에 참고하기 위해 제가 공부하며 정리한 내용입니다.
의역, 오역, 직역이 있을 수 있음을 알려드립니다.
This post is a translation of this original article [https://www.typescriptlang.org/docs/handbook/type-inference.html]

참고

공유하기