오버로딩

오버로딩이란?

이미 사용하려는 이름과 같은 이름을 가진 메소드가 있더라도 매개변수의 개수 또는 타입이 다르면, 같은 이름을 사용해서 메소드를 정의할 수 있다.

원래라면 자바스크립트에서 오버로딩을 사용할 수 없지만 타입스크립트에서 사용가능하다.
하지만 오버로딩은 웬만하면 쓰지말고 각각의 함수를 따로 만들어 가지고 사용하는게 좋다.

오버로딩 예) 파라미터를 하나만 받을 때

function stringOrStrings(memberOrMembers: string, member2?:string, member3?:string) : string | number{
  if(member2 && member3){
    return `아이브 : ${memberOrMembers}, ${member2}, ${member3}`;
  }else{
    return `아이브 : ${memberOrMembers}`;
  }
}

함수의 파라미터가 3개 인것을 볼 수 있다.
TS에서 파라미터 개수를 다르게 하기 위해서 member2, member3는 옵셔널(?)로 하여 안 넣어도 되는 타입으로 하였다.
이렇게 해서 파라미터 개수를 다르게 해서 오버로딩을 구현할 수 있는 단계에 왔다.

console.log(stringOrStrings('안유진, 장원영, 레이'));
console.log(stringOrStrings('안유진', '장원영', '레이'));

위에 있는 console.log는 파라미터 하나만 넣을 때이고
아래에 있는 console.log는 파라미터가 3개일 때이다.
물론 작동한다.

하지만

console.log(stringOrStrings('안유진', '장원영')); 

파라미터 2개일 때에도 된다. 왜냐하면 number3가 undefined이기 떄문에 else로 빠지게 된다.

우리는 파라미터 하나일 때와 파라미터가 3개일 때에만 가능하도록 하고 싶다.
이때 오버로딩을 사용한다.

function stringOrStrings(member: string):string; //오버로딩, 파라미터를 하나만 받는 것
function stringOrStrings(member1: string, member2: string, member3: string):string; //오버로딩, 파라미터를 하나만 받는 것
function stringOrStrings(member: string):number; //오버로딩, 파라미터를 하나만 받는 것

시그니처 함수를 정의하는 것이다.
오버로딩하는 이 시그니처 함수들에서 정의하는 파라미터 이름들이 구현체 파리미터 이름들과 매치가 안되도 된다. 순서만 맞으면 된다.
이로서 파라미터 하나일 때와, 3개일 때만 가능하도록 한다.

반환타입도 바꿀 수 있다. 하지만 구현체에서도 number가 나오도록 해야지 에러가 발생하지 않는다.