[TypeScript] 함수 타입 표현식과 호출 시그니처

kjy0124·2026년 2월 25일
post-thumbnail

🎯 함수 타입 표현식

✅ 타입 별칭을 이용하는 방법

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

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

type Add (매개변수 타입) => 반환값 타입

  • 이처럼 타입 별칭을 이용하여 작성하는 것을 "함수타입 표현식" 또는 "호출 표현식"이라고도 불림

✅ 함수 표현식을 여러개를 만들어야 할 때

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

const add: Operation = (a, b) => a + b;
const sub: Operation = (a, b) => a - b;
const multiply: Operation = (a, b) => a * b;
const divide: Operation = (a, b) => a / b;
  • 위 코드와 같이 타입 별칭을 사용하여 활용해주면 더욱 더 간단해진다.
  • 혹은, 타입별칭을 사용하지 않고 아래와 같이 작성해주어도 전혀 문제되지 않는다.
const add: (a: number, b: number) => number = (a, b) => a + b;

🎯 호출 시그니처(콜 시그니처)

✅ 사용 예시

type Operation2 = {
  (a: number, b: number): number;
};

const add2: (a: number, b: number) => number = (a, b) => a + b;
const sub2: Operation = (a, b) => a - b;
const multiply2: Operation = (a, b) => a * b;
const divide2: Operation = (a, b) => a / b;
  • 타입을 객체처럼 중괄호를 사용한 후 그 안에 소괄호에 매개변수를 적어주고 바로 타입을 지정
  • 이처럼, (a: number, b: number): number; 이 부분을 떼어서 별도로 함수 타입을 지정해주는 것을 호출 시그니처 라고 부른다.
  • 이는, 함수 표현식과 동일한 역할을 한다.
  • 이 때 아래 코드와 같이 추가로 프로퍼티를 작성 가능
type Operation2 = {
  (a: number, b: number): number;
  name: string;
};
  • 이를 하이브리드 타입 이라고 부름.

출처

한 입 크기로 잘라먹는 타입스크립트
https://www.inflearn.com/course/한입-크기-타입스크립트/dashboard

profile
개발 공부...

0개의 댓글