typescript 함수 오버로딩에 관하여..

interface Customer {
   name: string;
   age: number;
   height: string;
}
 
function testFunc(name: string, age: number | string, height: string): Customer | string {
   if (typeof age === 'number') {
      return { name, age, height };
   } else {
      return '에러가 발생했습니다.';
   }
}

위 testFunc 함수를 실행해보면 에러가 발생한다...
왜일까..? 언뜻 보면 옳은 코드인것 같지만

아래와 같이 발생한 에러를 보자..

const result1: Customer = testFunc('james', 30, '180.5'); //  error!
const result2: string = testFunc('jinny', '20', '150.5'); //  error!

위 코드는 모두 result1/result2에 할당 할 수 없다는 에러가 발생한다..
이 이유는 컴파일러 입장에서 testFunc 함수가 실제 Customer를 반환할지 string을 반환할지
확신할 수 없기 때문이다.

이럴때는 어떻게 처리를 해야할까.. 함수 오버로딩을 통해 해결 할 수 있다.

function testFunc(name: string, age: number, height: string): Customer;
function testFunc(name: string, age: string, height: string): string;
function testFunc(name: string, age: number | string, height: string): Customer | string {
   if (typeof age === 'number') {
      return { name, age, height };
   } else {
      return '에러가 발생했습니다.';
   }
}

const result1: Customer = testFunc('james', 30, '180.5');
const result2: string = testFunc('jinny', '20', '150.5');

위 코드를 보면 알듯이 함수 오버로딩은 중괄호 {} 없는 함수를 실제 함수 위에다가 써주면 된다.

어떤 함수의 리턴 값이 여러개가 나올 수 있을때 저런식으로 오버로딩을 해준다면 처리가 수월할것 같다.