Call signature

YOUNGJOO-YOON·2021년 7월 6일
0

typeScript

목록 보기
19/65

In JavaScript, functions can have properties in addition to being callable. However, the function type expression syntax doesn’t allow for declaring properties. If we want to describe something callable with properties, we can write a call signature in an object type:


type DescribableFunction = {
  description: string;
  (someArg: number): boolean;
};
function doSomething(fn: DescribableFunction) {
  console.log(fn.description + " returned " + fn(6));
}

Note that the syntax is slightly different compared to a function type expression - use : between the parameter list and the return type rather than =>.

타입스크립트 핸드북의 가장 큰 장벽은 함수를 선언만 해주고 실제 사용하는 것은 전혀 보여주지 않는다는 것이다.

아무튼 stack overflower 형님들의 도움을 받아 위 코드가 무엇을 의미하는지 한 줄 한 줄 해석해보자.
stack 출처

자바스크립트에서 함수는 properties를 가질 수 있다. 라는 것이 이 Call signature의 핵심 주제이다.
아래의 JS 코드가 말이 되는지 보자.


const fn=(arg)=>{
	return arg>1; // return boolean
};

fn.string = 'string';

console.log(fn(0)); // false
console.log(fn.string); // string

이것을 TS 문법에 맞게 똑같이 해주는 것이 Call signature이다.
개인적으로 이러한 문법은 읽기 힘들고 까다롭다고 생각해 사용하지 않는다.

아무튼 해보도록 하자.

type DescribableFunction = {
	description: string;
	(someArg: number): boolean;
      };
      function doSomething(fn: DescribableFunction) {
	console.log(fn.description + " returned " + fn(6));
      }

      const fn=function(n:number){
	      return n+1>1;
      };
      fn.description='BLACK';

      doSomething(fn); // BLACK returned true

JS의 경우 타입 선언이 없기 때문에 우선적으로 선언해주는 타입 구문이 필요없다.
하지만 TS의 경우 추가하고 싶은 타입을 미리 선언해놓고 .연산자를 통해 함수에 description을 추가해준다.

profile
이 블로그의 글은 제 생각을 정리한 글과 인터넷 어딘가에서 배운 것을 정리한 글입니다. 출처는 되도록 남기도록 하겠습니다. 수정 및 건의 오류 등이 있으면 언제든지 댓글 부탁드립니다.

0개의 댓글