TypeScript - 함수 (2) Overloading

Younkyum J·2022년 7월 5일
0

TypeScript

목록 보기
5/8
post-thumbnail

Overloading

Overloading의 개념

일반적인 Call Signature를 생각해보자.

type Form = {
  (a: number, b: number): number
}

const add: Form = (a, b) => a+b

하지만, 이렇게 하나의 type만 정의되지 않을 수 있다.

type Form = {
  (a: number, b: number): number
  (a: number, b: string): number
}

const add: Form = (a, b) = {
  return a + b // Error 발생
}

여기서 에러가 발생하는 까닭은, b가 string의 타입값을 가질 수 있는 가능성이 있기 때문이다.
타입을 엄격히 지정하는 TS의 특성상 number a와 string b를 더할 수 없는 것은 당연한 이야기이다.

따라서, 이를 해결하기 위해서는 Overloading이 필요하다.

const add: Form = (a, b) = {
  if (typeof b === "string") return a
  return a + b
}

이와 같이, Overloading은 하나의 함수가 여러 Call Signature 가지게 될때 사용된다.

Overload의 사용처

Overloading은 같은 함수가 여러개의 Call Signature를 가질 때 사용한다.


변수의 개수가 다른 Overloading

Overloading이 되는 경우 중 이러한 경우가 발생할 수 있다.

type Form = {
  (a: number, b: number): number // 변수 2개
  (a: number, b: number, c: number): number  // 변수 3개
}

const add: Form = (a, b, c) => {
  return a + b + c // Error: Type '(a: number, b: number, c: number) => number' is not assignable to type 'Form'.
}

따라서 이러한 경우, 우리가 전에 배웠던 Optional을 사용하여야 한다.

const add: Form = (a, b, c?:number) => {
  if (c) return a + b + c
  return a + b
}

이 경우에는 문제없이 실행시킬 수 있다.




*본 내용은 노마드코더 "Typescript로 블록체인 만들기"에서 습득한 내용을 바탕으로 재구성한 것 입니다.

profile
기획자입니다. 근데 이제 고양이와 애플덕후와 개발을 곁들인.

0개의 댓글