<TS> 효과적으로 타입 명시하기

1. 소개

 필자가 타입스크립트를 사용하던 초반엔 선언하는 모든 곳에 당연히 타입을 명시해야 한다고 생각했다. 하지만 타입스크립트를 계속 쓰다보니 자연스럽게 타입추론이 생각보다 잘 일어난다는 것을 깨달았고, 단순한 선언 구문에서는 사용하지 않았다.

 

타입 스크립트의 많은 타입 구문은 사실 불필요합니다.

이펙티브 타입스크립트 p.108

 

 그럼에도 불구하고 타입을 언제 명시하는 것이 좋을지에 대해서는 크게 생각해본 적이 없었다. 그러나 최근 이펙티브 타입스크립트를 읽으며 타입추론에 대해 좀 더 자세하게 접하게 되었고, 그 중 어떤 상황에서 타입명시를 쓰면 좋을지에 대해 읽고 정리해보았다.

 

타입이 추론될 수 있음에도 여전히 타입을 명시하고 싶은 몇 가지 상황이 있습니다.

이펙티브 타입스크립트 p.112

 

2. 사용

* 실제 오류가 발생한 위치를 표시

 

 - 왼쪽과 같이 특정 타입(User)을 매개변수로 받는 함수가 있다고 가정해보자. 이 때 오른쪽과 같은 객체를 넣게되면 오류가 출력된다. 왜냐하면 객체가 타입추론을 통해 {id: string; name: string} 을 갖게 되기 때문이다.

 

 - 그러나 실제 문제가 되는 부분은 어디일까. 바로 개발자의 실수로 myUser을 잘못 작성한 부분일 것이다. 만약 객체 리터럴을 정의할 때 타입을 명시했다면 속성 체크가 동작하여 아래와 같이 실제 문제가 되는 부분을 사전에 찾아낼 수 있었을 것이다.

 

 

 - 이는 함수를 구현할 때에도 마찬가지이다.

 

 

 - getResponse 함수는 프로미스 객체를 뱉는 함수이길 기대한다. 내용을 보면 이미 유저 정보가 있는 경우 캐시로써 바로 결과를 뱉게되는데, 이것이 타입이 맞지 않아 then을 호출할 수 없는 것이다. 즉 실제로 개발자의 실수는 함수내의 If문을 잘못 작성한 것이다.

 

 

 - 만약 함수를 작성할때, 미리 반환값을 명시했다면 실제 개발자의 실수가 발생한 위치를 미리 알 수 있었을 것이다. (위의 해결책은 Promise.resolve(userInfo) 를 넣는 것이다.)

 

* 목적에 맞는 구현

 - 타입을 명시함으로써 우리는 목적에 맞게 구현을 해내도록 유도받는다. 함수의 경우 위에서처럼 반환타입을 명시하여 작성하게되면 함수의 목적을 명확하게 알 수 있다. 이는 함수를 사용할 때 뿐만 아니라 함수를 작성할 때에도 이점을 갖는다. 함수를 작성하다보면 종종 반환값에 대한 표현이 모호해지거나 목적을 잊기도 한다. 하지만 이를 미리 방지하고 함수가 복잡해지더라도 목적에 맞게 함수를 작성할 수 있다.

 

 - 이는 함수를 리팩토링 할때에도 동일하게 작용한다. 타입이 명시되어있다면 우리는 함수의 결과 타입을 보장하며 함수를 수정할 수 있게 될 것이다.

 

* 직관적인 표현

 

 - 유저 정보 객체를 얻어주는 위와 같이 단순한 함수를 생각해보자. 결과 값은 자연스럽게 위와 같이 추론된다. 하지만 결과가 복잡해질수록 위와 같은 타입추론은 시각적으로 불편해지기 시작할 것이다.

 

 - 사실 반환되는 타입은 우리가 가장 위에서 정의했던 User라는 타입이다. 우리가 얻고 싶은 객체도 당연히 User라는 타입이다. 따라서 반환타입을 명시하여 아래와 같이 출력되는 것이 DX(Developer Experience)를 향상시키는 방법이다.

 

 

---

참고

 

 해당 포스팅은 이펙티브 타입스크립트를 읽고 개인적으로 필요한 내용을 추가 및 정리한 글입니다.

 

 

이펙티브 타입스크립트 - YES24