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

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

 

그래서 함수는 총 두 군데 타입지정이 가능합니다.

1. 함수로 들어오는 자료 (파라미터)

2. 함수에서 나가는 자료 (return)

 

 

function 내함수(x :number) :number { 
  return x * 2 
}

1. 함수로 들어오는 파라미터 타입지정은 파라미터 옆에 적으면 됩니다.

2. 함수가 실행된 후 남는 값 (return 우측에 있는 값) 타입지정하고 싶으면 함수명() 우측에 적으면 됩니다.

 

함수에 멋있게 타입 실드를 장착했기 때문에

이제 파라미터와 리턴값이 이상해지면 자동으로 혼내줍니다. 

 

- 파라미터에 타입을 지정하면 필수 파라미터가 됩니다. 

 

 

 

 

 

 

함수는 void 타입이 있음

 

함수는 특이하게도 void라는 타입을 사용가능합니다.

'아무것도 없이 공허함'을 뜻하는 타입인데  

return할 자료가 없는 함수의 타입으로 사용가능합니다.

 

 

function 내함수(x :number) :void { 
  return x * 2 //여기서 에러남 
}

그럼 이제 이 함수에서 뭔가를 return하려고할 때 에러를 냅니다.

함수에 return 방지장치를 주고 싶을 때 void 타입을 활용하시면 되겠습니다. 

 

 

 

 

파라미터가 옵션일 경우

 

함수에 파라미터자리를 만들어놨지만 가끔 파라미터 없이 쓸 때도 있습니다.

그럴 경우 타입스크립트에선 미리 "이 파라미터는 옵션임" 이렇게 정의를 해주셔야 에러가 나지 않습니다.

 

function 내함수(x? :number) {}
내함수(); //가능
내함수(2); //가능

 

파라미터 우측에 그냥 물음표치면 됩니다. 그럼 앞으로 내함수()를 사용할 때 파라미터없이도 쓸 수 있습니다.

근데 물음표는 실은 x : number | undefined 이거랑 똑같은 의미입니다 (중요)

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

 

 

 

 

 

함수도 예외없이 Union type을 사용하면 

 

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

 

Q. 예를 들어서 함수에 숫자 또는 문자를 집어넣으면 + 1 해주는 함수를 만들어봅시다.

 

function 자릿수세기(x :number | string){ 
  return x + 1 
}

그냥 쌩 자바스크립트에서는 문자나 숫자나 모두 +1 이 가능하지만

타입스크립트에선 변수의 타입이 number | string 이런 union type인 경우 자료 조작을 금지시킵니다. 

아직 이 파라미터의 타입이 확실하지 않으니까 파라미터 조작을 일단 실드로 막고 금지하는 것입니다.

 

 

function 내함수(x? :number) :number { 
  return x * 2 
}

이런 코드도 타입스크립트가 엄격하게 금지합니다.

 

number 맞는데 왜저럴까요 빨리 혼자 말해보셈

 

x라는 파라미터는 옵션이고, 옵션인 파라미터는 number | undefined 이런 식으로 타입정의가 된다고 하지 않았습니까.

그래서 아직 x라는 파라미터가 뭔지 확실하지 않기 때문에 에러를 내줍니다.

 

 

그래서 엄격한 타입스크립트 성격에 맞춰주려면 여러분이 코드를 애초에 엄격하게 짜야합니다.

 

 

 

 

<출처 : 코딩애플 - 빠르게 마스터하는 타입스크립트>