우리가 왜 함수를 썼더라?
함수라는 문법은 원래 용도가 긴 코드를 짧게 축약하려고 만든 것도 있는데,
우리가 수학에서 함수를 쓸 때 생각을 해보자면 어떤 숫자를 입력했을 때 다른 숫자가 나오는 깔때기 역할을 하는 것이었죠.
그러니까 우리가 코딩할 때도 똑같이 어떤 자료를 입력하면 다른 자료를 뱉어주는 신기한 박스 역할이다.
실제 코드로 만들어보면
이렇게 곱셈해주는 신기한 박스가 완성된다.
소괄호 안에 들어가있는 x같은 자료들을 우리는 파라미터라고 부르고 return 오른쪽에 있는 자료들을 리턴 값 이라고 부른다.
- 파라미터를 작명해주면 함수를 사용할 때 () 소괄호 안에 아무 자료나 집어넣을 수 있게 되고
- 리턴 값은 함수가 사용되고 나서 그 자리에 남는 값이 된다.
a(2)이렇게 함수를 호출해주면 그 자리에 return 우측에 있는 값이 남게 된다. =>4
함수에 타입 지정하게 해주세요!
그렇기 때문에 함수는 총 두 곳에 타입지정이 가능하다.
- 함수가 들어가는 자료 (파라미터)
- 함수에서 나가는 자료 (return)
함수에서 들어오는 파라미너의 타입을 지정할 때는 파라미터 옆에 적으면 된다. return 값에 타입 지정을 해주고 싶다면 함수명() 우측에 적으면 된다.
함수에 멋있게 타입 쉴드를 장착했기 때문에 이제 파라미터와 리턴 값이 이상해지면 자동으로 혼내준다.
❗️ 파라미터에 타입을 지정하면 필수 파라미터가 된다!
Void Type
함수에서는 특이하게 void라는 타입을 사용할 수 있다. 직역하자면 '아무것도 없이 공허하다'는 뜻을 가진 타입인데 return할 자료가 없는 함수의 타입으로 사용할 수 있다.
그럼 이제 이 함수에서 뭔가를 return 하려고 할 때 에러를 내준다. 함수에 return 방지장치를 주고 싶을 때 void 타입을 활용하면 된다.
파라미터가 옵션일 때,
함수에 파라미터자리를 만들어놨지만 가끔 파라미터 없이 쓸 때도 있다.
그럴 경우에는 타입스크립트에서 미리 "이 파라미터는 옵션이에요"라고 정의를 해두어야 에러가 나지 않는다.
이 경우 방법은 매우 간단하다. 파라미터 우측에 ?기호를 써주면 된다. 그럼 앞으로 a()를 사용할 때 파라미터 없이도 쓸 수 있다.
근데 이 말은
x: number | undefined랑 똑같은 의미다.
파라미터가 정의되지 않으면 자동으로 undefined가 되니까 그것을 반영한거라고 생각할 수 있다.
함수에도 예외없다 Union Type
union type 사용 시 엄근진한 타입스크립트가 딴지를 걸 수도 있다.
예를 들어, 함수에 숫자 또는 문자를 집어넣으면 +1 해주는 함수가 있다.
그냥 생 자바스크립트에선 문자나 숫자 모두 +1이 가능하지만,
타입스크립트에서는 변수의 타입이 number | string 이런 union type인 경우에 자료 조작을 금지시킨다. 아직 이 파라미터의 타입이 확실하지 않으니 일단 파라미터의 조작을 쉴드로 막고 금지시킨다.
또한,
이런 코드도 타입스크립트가 엄격하게 금지하는데,
여기서 x라는 파라미터는 옵션이고, 옵션인 파라미터는 number | undefined로 타입을 정의할 수 있는데 그래서 아직 x라는 파라미터가 어떤 타입인지 확실하지 않기 때문에 에러를 내뿜는다.
그래서 엄격한 타입스크립트의 성격에 맞춰주려면 내가.. 코드를 엄격하게 짜야한다.
