Call Signature

function add(a: number, b: number) {
  return a + b;
}

const add = (a: number, b: number) => a + b;

• 함수의 call signature란 위 사진처럼 함수 add에 마우스 커서를 올려보면 보게되는 것을 말함.
• 인자(argument)의 타입과 함수의 반환 타입을 알려준다.
• 함수를 어떻게 호출해야 하는지 알려준다.

  ---

나만의 call signature 만들기

type Add = (a: number, b: number) => number;//이게 call signature

const add: Add = (a, b) => a + b;

변수 add를 선언할 때 타입스크립트에게 타입이 number라고 말해줄 필요가 없다.

• 함수를 구현하기 전에 내가 타입을 만들 수 있고, 함수가 어떻게 작동하는지 서술해둘 수 있다.
• 내가 타입을 생각하도록 해준다.
• 코드를 구현하면서 타입들을 써줘야 했지만 그 과정을 분리해준다.

---

주의할 점

위 함수에서..

type Add = (a: number, b: number) => number;

const add: Add = (a, b) => {a + b}; //a+b가 아니라 {}안에 a+b를 쓰면

{}안의 {a+b}가 함수 내부 내용으로 처리돼서 return값이void가 된다.
즉,

const add: Add = (a, b) => a + b;

이 화살표 함수는 다음과 같다.

function add(a, b): Add {
  return a + b;
}

그러나

const add: Add = (a, b) => {a + b};

이 화살표 함수는 다음과 같다.

function add(a, b) : Add {
  a + b;
}

• 즉, 화살표 함수에서 {}를 사용하면 그 안의 값은 return(반환)이 아니라 함수 내부 내용으로 처리되기에 반환값이 없는 void로 처리된다.
• 이에 따라 위에서 미리 선언한
  type Add = (a: number, b: number) => number;
  의 내용과 충돌하여 error가 발생한다.
• number를 return 해야 하는데 return값이 없는 void로 처리되기 때문.