[ Typescript ] - 함수에 타입 지정하는 법 & void 타입

최문길·2023년 12월 20일
1

Typescript

목록 보기
5/23

함수에 타입을 입혀보자

함수는 특징이 있는데,...

  1. 함수는 파라미터로 인자 값을 가진다.

  2. 함수는 return 값을 가진다.

따라서

함수에 타입지정하려면 2곳이 가능하다.

  1. 함수로 들어오는 자료 (파라미터)
  2. 함수에서 나가는 자료 (return)
function 함수(x : number) : number {
  return x*2
}

const arrow1 = (x:number) :number=> x*2

const arrow2 = (x:number) :number=> {
      return x*2
}
  1. 함수로 들오는 파라미터 타입지정은 파라미터 옆에 적으면 된다.
  2. 함수가 실행된 후 남는 값 ( return 우측에 있는 값 ) 타입지정하고 싶으면 함수명 () 우측에 적으면 된다.
  • 파라미터에 타입을 지정하면 필수로 함수를 호출 할 때 인자 값을 넣어야하며
  • return 에 타입이 있다면 필수로 return 값이 있어야 한다.

void type

함수에 void 타입이 있음

내가 함수를 만들어 사용 할 때 값을 반드시 return 하지 않았다.

return 할 값, 자료가 없을 때 void 타입을 함수에 명시해 주면 된다.

function 함수(x:number) : void {
  return x *2// return 이 명시 되어있으면 에러문구 발생함
}

파라미터에 옵션좀 달아보자

차에만 옵션을 다는 것이 아닌
함수에도 옵션을 달아보자

파라미터 옵션일 경우

function 함수(x ?: number ) { }

함수(); // 가능
함수(2); // 가능

파라미터 우측에 그냥 물음표치면 되는데..

물음표 를 보면 optional chaning operator 같아 보인다.

아무튼

물음표는

x : number | undefined

랑 똑같은 의미임

파라미터가 정의가 안되면 자동으로 undefined가 되니까 그걸 반영한거라고 볼 수 도 있다.

함수의 union type에 관하여

함수에 union 타입을 써주는 경우에도 예외없이

엄격근엄진지한 타입스크립트가 딴지를 걸수가있다.

function a( x: string | number ):number {
  return x + 1
}

x 라는 인자값의 타입이 확실하지 못하므로 에러 발생

function a(x ?: number ) : number {
  return  x*2
}

위 와 같이 결국
x : number | undefined 랑 똑같은 의미이기에
union 타입이며 타입이 확실하지 못하기 때문이다.

정리

함수에서 파라미터와 return 값에 type을 정의 할 수 있다.

  • void를 사용하여 return 값을 가지지 않을 때 type을 명시 할 수 있다.
  • ?를 통해 type의 조건을 자동으로 union 만들 수 있다 .

0개의 댓글