Typescript Overloading

최재홍·2023년 10월 8일
0
post-custom-banner

Overloading

오버로딩은 함수가 여러개의 call signatures를 가지고 있을 때 발생시킨다.

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

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

이렇게 정의하면 add라는 함수가 실행 될 때, b의 type에 따라서 다르게 실행될 것이다. 이런식으로 함수를 선언할 수 있으나, 이런 방식은 그다지 좋은 방식이 아니다.

type Config = {
	path: string,
	state: object
}

type Push = {
	(path : string) : void
	(config : Config) : void
}

const push: Push = (config) => {
  if(typeof config === "string") { console.log(config) }
  else {
    console.log(config.path, config.state)
  }
}

이게 가장 흔하게 볼 수 있는 오버로딩의 형태이다.
(잘 이해가 가지 않는군;)

파라미터의 숫자가 다른 경우의 call signatures도 알아보자.

type Add = {
	(a:number, b:number) : number
	(a:number, b:number, c:number) : number
}

이렇게 call signature를 설정한 상태에서

type Add = {
	(a:number, b:number) : number
	(a:number, b:number, c:number) : number
}

const add:Add = (a,b,c) => {
  return a + b
}

이런 함수를 선언해도 동작하지 않는다.

type Add = {
	(a:number, b:number) : number
	(a:number, b:number, c:number) : number
}

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

(이것도 잘 와닿지 않는군;;;;)

post-custom-banner

0개의 댓글