⚡️ function(함수)
함수라는 문법은 원래 용도가 긴 코드를 짧게 축약하려고 만든 것도 있는데
실은 어떤 자료를 입력하면 다른 자료를 불러오는 기계 역할을 한다.
2를 넣으면 4가 되고, 4를 넣으면 8이되는 그런 기계를 만들고 싶으면
함수를 가져다가 쓴다.
실제로 코드로 만들어보면
function 내함수(x){ return x * 2 } 내함수(2); // 4 내함수(4); // 8소괄호 안에 들어가는 x같은 자료들을
파라미터라고 부르고
return 오른쪽에 있는 자료들을리턴값이라 부른다.
- 파라미터를 작명해주면 함수를 사용할 때 () 소괄호 안에 아무 자료나 집어넣을 수 있게되고
- 리턴값은 함수가 사용되고나서 그 자리에 남는 값이다.
내함수(2) 이렇게 쓰고나면 진짜 그 자리에 return 우측에 있던 값이 남는다.
function(함수)에 타입 지정
✏️ 함수는 총 두 군데 타입 지정이 가능하다.
1. 함수로 들어오는 자료(파라미터)
2. 함수에서 나가는 자료(return)
function 내함수(x :number) :number {
return x * 2
}- 함수로 들어오는 파라미터 타입 지정은 파라미터 옆에 적으면 된다.
- 함수에 타입 실드를 지정했기 때문에 이제 파라미터와 리턴값이 이상해지면 에러가 발생한다.
- 파라미터에 타입을 지정하면 필수 파라미터가 된다.
⚡️ void
✏️ 함수는 특이하게도 void라는 타입 사용이 가능하며, 어떤 타입도 가지고 있지 않는 빈 상태를 의미하는 자료형이다.
function 내함수(x :number) :void) {
return x * 2 // 여기서 에러가 발생
}이 함수에서 뭔가를 return하려고 할 때 에러를 낸다.
함수에 return 방지장치를 주고 싶을 때 void 타입을 활용하면 된다.
파리마티가 옵션일 경우
함수에 파라미터 자리를 만들어놨지만 가끔 파라미터 없이 쓸 때도 있다.
그럴 경우 타입스크립트에선 미리 "이 파라미터는 옵션임" 이렇게 정의를 해줘야 에러가 발생하지 않는다.
function 내함수(x? :number) {
}
내함수(); // 가능
내함수(2); // 가능파라미터 우측에 ? 를 붙이면 된다. 그럼 앞으로 내함수()사용할 때 파라미터 없이도 쓸 수 있다.
여기서 ?는 x: number | undefiend와 같은 의미이다.
파라미터가 정의가 안되면 자동으로 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라는 파라미터가 뭔지 확실하지 않기 때문에 에러를 낸다.
