[TypeScript] 함수 타입 작성

💻 들어가며

앞선 포스팅에서 일반 자료형에 대한 타입 설정방법을 작성했다면 이번에는

함수는 타입스크립트에서 어떻게 작성되는지에 대한 내용을 복습하면서 포스팅해보고자한다.

 

타입스크립트 연습 웹 사이트

TS Playground - An online editor for exploring TypeScript and JavaScript

 

---

 

📚 TypeScript에서 함수

 

📗 Call Signatures

함수가 어떻게 호출되는지 알려주는 기능 (매개변수,  리턴값의 타입을 알려줌)

 

❌  타입이 nubmer인 return 값을 중괄호로 묶을 경우 Call signature

 

 

❌  매개변수의 타입을 다르게 선언할 경우 Call signature

---

📗  overloading

함수가 서로다른 여러개의 call signiture을 가질때 발생

 

❌ 밑의 이미지와 같이 함수는 여러개의 call signature를 가질 수 있고 이는 에러를 발생시킴

 

 

✅ type에 대한 조건문을 걸어주면 정상 작동

 

 

같은 타입이지만 매개변수의 갯수가 다른 경우

 

❌  매개변수 c 없다고 에러

 

 

✅  매개변수 c가 옵션으로 지정해서 에러 제거

 

 

➡️  ? : Default values indicator : 필수적인 매개변수가 아니라 옵션값이라는 것을 명시해줌

출처 : TypsCript 공식문서 (클릭시 해당 문서로 이동)

---

📗  polymorphism

여러 타입이 들어올 수 있는 특성

generic : call signature를 작성할 때 어떤 타입이 들어올 지 정확히 모를때 사용 (TS가 자동으로 타입을 유추한다)

함수 인자에 어떤 값이 들어오는지에 상관없이 자동으로 매개변수의 타입을 지정해주는 기능

(+) generic에 어떤 값이 들어와도 상관없다는 것을 보여주기위해 한글로 작성

type 타입명 = {
	<제네릭>(매개변수: 제네릭): 리턴값 // 리턴값에도 제네릭이 들어갈 수 있다
}
// 주로 제네릭 값에는 T가 들어감

 

✅ 인자로 여러가지 타입이 들어와도 타입스크립트는 자동으로 타입을 지정해주고 에러없이 함수 호출이 가능하다

 

 

 

 

⚠️ any대신 generic을 사용하는 이유

arr[0]의 타입이 number임에도 string 메소드인 toUpperString() 메소드를 사용해도 에러가 나오지않음

실행후에 에러가 발생하는 것을 확인할 수 있다.

 

 

 

⚠️ any를 generic으로 변경한다면?

any타입과는 달리 현재  a[0]요소는 number | string | boolean 타입이 들어올 수 있고 현재는 number에 해당되기 때문에
 toUpperString() 메소드는 string 타입에만 사용가능해서 에러 발생

 

 

여러개의 generic을 사용

<T>, <M> generic이 들어오는 경우로 매개변수의 순서를 기준으로 타입을 파악함