함수의 타입 명시

함수의 반환 (return) 타입

함수에 최종 리턴값 함수 의 반환 타입을 명시하는 방법

function sendGreeting(message, userName){
  console.log(`${message}. ${userName}`);
}

sendGreeting("Hello", "Mark");

타입이 명시 되지 않은 자바스크립트 함수 이다.
매개변수를 받아서 그 값을 콘솔로그에 출력하는 함수 이다.

타입스크립트 에서 함수의 반환값 을 나타내기 위해서 파라미터를 포함하고 있는 괄호 뒤에 : 콜론을 찍고 반환타입을 명시해 줄 수 있다.

void 타입
- 아무것도 반환 하지 않는 함수의 반환 값으로만 사용될 수 있는 타입
```
function sendGreeting(message, userName): void {
  return "hello, Mark" ;
}
```
string 타입
- 함수의 return 값이 문자열 이라면 string 이라고 명시해 줄 수 있다.
```
  function sendGreeting(message, userName): string {
    return "hellog, Mark"
  }
```
[] 배열 타입
- 반환 되는 값이 배열 타입인 경우 배열 타입을 명시해 줄 수 있다.
```
function sendGreeting(message, userName): string[] {
  return ['hello, mark'];
}
```

함수의 매개변수 타입 명시

변수에 타입을 명시 할 수 있듯이 매개변수에도 타입을 명시 할 수 있다.

function sendGreeting(message: string, userName: string): void {
  console.log(`${message}. ${userName}`);
}

sendGreeting("hello","mark");

string 타입이 명시된 후에는 streing 말고 다른 타입을 가진 인자 (argument) 는 전달 될 수 없다.

function sendGreeting(message:string, userName:stirng): void {
  console.log(`${message}. ${userName}`);
}

sendGreeting("Hello", 1);

이렇게 숫자를 전달 하려고 하면 타입에 관한 에러 메세지가 나오게 된다.

⚠️ Argument of type ‘number’ is not assignable to parameter of type ‘string’

만약 함수를 호출 할 때 첫번째 매개변수에 메시지 만을 인자로 전달 하고 싶을때에는 두번째 인자만을 지우면 될까 ?

function sendGreeting ( message:string, userName: string): void {
  console.log(`${message}. ${userName}`);
}

sendGreeting("Hello");

🙅‍♂️ 아니다 두번째 인자를 그냥 지우기만 하면 분명 에러가 생길것 이다.

⚠️ An argument for ‘userName’ was not provided

이런 메시지가 나오는 이유는 타입스크립트는

함수에 정의된 모든 매개변수가 함수에 필요하다고 가정하기 때문이다.

즉, 함수가 호출 되면 타입스크립트 컴파일러는 함수에 정의된 매개변수와 함수를 호출 할 때 전달되는 인자를 비교 검사 하게 되는데, 매개변수와 인자의 수가 일치 하지 않으면 에러 메시지가 나오게 된다.

🟣 해결 방법

선택적 매개변수 (Option Parameter)
매개 변수 이름 뒤에 ? 물음표를 붙이면 선택적 매개변수가 되면서 에러메시지도 사라지게 된다.

function sendGreeting (message:string, userName?:string): void {
  console.log(`${message}. ${userName}`);
}

sendGreeting("Hello");

!중요!

전달되는 매개변수가 여러개이고 전달되는 매개변수 중 몇가지만 매개변수인 경우 선택적 매개변수 들은 반드시 필수 매개변수 뒤에 나타나야 한다.

타입스크립트 규칙상 하나의 매개변수가 선택적 매갭 변수가 되면
오른쪽에 위치한 나머지 매개변수 들 역시 선택적 매개변수가 되어야 하기 때문이다.

기본 매개변수 (Default Parameter)

function sendGreeting ( message:string, userNmae?:string):void {
  console.log(`${message}. ${userName}`);
}

sendGreeting("Hellog");

터미널에서 node app.js 명령어를 넣고 실행 시키면 호출된 함수가 실행이 되고 콘솔로그의 값이 터미널에 출력이 되는데
출력된 콘솔로그의 값은 두번재 파라미터 userName 의 값이 전달 되지 않아 Hello, undefiend 라고 나오게 된다.

이렇게 아무런 값이 전달 되지 않을때 undefined 대신 할당된 값을 출력 하려면 기본 매개변수를 사용 할 수 있다.

-> 사용법은 매우 간단 하다. <-

그냥 매개변수 뒤에 = 그리고 기본값이 될 값을 할당 해주면 된다. 그러면 함수의 값이 아무것도 전달되지 않을 때 지정 해준 기본값이 자동으로 매개변수에 할당 되게 된다.
이렇게 기본 매개변수를 사용 할 시에는 더이상 선택적 매개변수가 필요하지 않게 되기 때문에 ? 물음표는 더이상 필요가 없게 된다.
그리고 string 을 나타내는등에 타입들도 필요가 없게 된다.

function sendGreeting (message: string, userName = "ther"):void {
  console.log (`${message}. ${userName}`);
}

sendGreeting("Hello");

(매개변수의 타입을 지워주는 이유는 타입스크립트의 타입추론과 연관되어 있다. 매개변수의 기본값이 주어지는 코드를 통해서 타입스크립트는 타입추론으로 userName 의 매개변수의 타입이 string 값이 됨을 알게 되기 때문이다. 따라서 보다 간결한 코드를 위해서 매개변수에 스트링 타입을 생략 하는것이 좋다.)

화살표 함수 ( Arrow Function )

단순하고 간결한 문법으로 함수를 만들기 위해서 사용 되는 방법이다.

function add (num1, num2){
  return num1 + num2;
}

🔽

const add = (num1 + num2) => num1 + num2 ;

const sendGreeting = (message: string, userName = "there"): void =>
  console.log(`${message}. ${userName}`);

sendGreeting("Hello");