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을 추가해준다.