Function Types

Introduction to TypeScript function types

function type은 parameter와 return type 2개가 있음. 함수 선언할때 아래와 같은 syntax로 두 개다 해줘야함.

(parameter: type, parameter:type,...) => type

아래 예시는 2개의 number를 받아서 number를 리턴해주는 function type을 가지는 변수를 선언함.

let add: (x: number, y: number) => number;

위 예시에서 function type은 인자로 number type인 x, y를 선언함. return 값의 type은number임.

변수를 function type으로 선언할때 변수에 같은 type의 함수를 할당할 수 있음. 컴파일러가 parameter의 개수와 type 그리고 return type을 맞춰줌. 아래가 그 예시로 add변수에 함수를 할당한 것임.

add = function (x: number, y: number) {
   return x + y;
};

또 한 아래처럼 변수 선언하고 거기에 함수 할당할 수도 있음.

let add: (a: number, b: number) => number =
    function (x: number, y: number) {
        return x + y;
    };

아래처럼 add 변수에 맞지않는 type의 함수를 할당하면 에러나옴.
위에서 a:number, b:number로 type을 해놨는데 string이어서 type이 맞지않아 에러나오는 것임.

add = function (x: string, y: string): number {
    return x.concat(y).length;
};

Inferring function types

let add = function (x: number, y:number): number {
  return x + y;
}

let result = add(10, 20);

위 코드처럼 = 을 사이에 두고 한쪽에만 type을 가지고 있을때 컴파일러가 function type을 알아낼 수 있음. 이는 type inference의 한 종류로 contextual typing이라고 함.
예시에서 add함수는 (x: number, y:number) => number의 type을 받음.

출처