함수 타입과 콜백 타입

기본 패턴

type Formatter = (value: number) => string;

function formatPrice(value: number, fn: Formatter) {
  return fn(value);
}

설명

• 함수 타입은 "어떤 입력을 받고 어떤 값을 돌려주는가"를 타입 수준에서 표현합니다.
• 변수에 함수를 저장할 때, 콜백을 받을 때, 객체 프로퍼티로 함수를 둘 때 함수 타입 표현이 자주 쓰입니다.
• 매개변수 타입과 반환 타입을 적절히 명시하면, 함수 경계가 곧 API 계약처럼 작동합니다.
• 선택 매개변수, 기본값, rest parameter도 함수 타입 설계의 일부이며, 호출 가능한 형태를 결정합니다.
• 특히 콜백 타입을 분명히 해 두면 비동기 API, 배열 메서드, 이벤트 처리 코드가 훨씬 읽기 쉬워집니다.

짧은 예제

function mapToLabel(
  values: number[],
  formatter: (value: number) => string,
) {
  return values.map(formatter);
}

빠른 정리

주의할 점