본문 바로가기
Front-End/Typescript

Call Signatures

by developerDoorold 2022. 12. 16.

문가가 공부한 기록입니다. 부정확한 내용은 편히 지적 부탁드립니다.


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

타입스크립트에서 위와 같이 함수를 선언하면 Arguments가 이상하다고 불평을 한다. 그 이유는 a와 b의 타입을 추론할 수 없기 때문이다.(위 경우 a, b는 any타입을 갖고 있고 타입스크립트는 any 타입을 좋아하지 않는다.)

 

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

// 아래와 같이 함수에 number를 표시하는 것은 필수는 아니다. 
// function add(a: number, b: number): number {
//   return a + b;
// }

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

위와 같이 Arguments에 타입을 선언해주면 아무런 문제가 없다. 하지만 우리는 Arguments에 타입을 지정하지 않고 add 함수만의 타입을 지정해주는 것이다. 

 

앞으로 작성하는 것은 Call signatures이며 Call Signatures는 함수 위에 마우스를 올렸을 때 보이는 것을 말한다. 이것은 함수가 어떻게 구현되는지를 알려주는 것이 아니라, 인자(Arguments)의 타입과 함수의 반환 타입을 알려준다.

// 함수의 Call signatures
type Add = (a: number, b: number) => number;

// add의 타입을 타입스크립트가 알고 있기 때문에 인자에 타입값을 표시할 이유가 없다.
const add: Add = (a, b) => a + b;

이는 직접 타입을 만들고, 특정 함수를 구현하기 전에 그 함수가 어떻게 작동하는지 서술해둘 수 있다는 의미다. 이는 타입을 생각한 이후 코드를 구현하게 만든다. 

 

 

 

+참고자료

https://nomadcoders.co/typescript-for-beginners/lectures/3673

댓글