함수 (Function)

타입스크립트에서 함수는 어떻게 정의하는지 살펴보자.

function printName(name: string) {
  console.log(name);
}

function returnCouple(person1: string, person2: string) {
  return `${person1}과 ${person2}은 커플입니다.`;
}

console.log(returnCouple('태연', '창한'));
console.log(returnCouple('태연', '창한', 'ddd')); // X
console.log(returnCouple('태연')); // X

JS 함수와 다른 점

• 함수 호출 시 인자의 개수가 선언한 함수와 다르면 에러를 발생시킴
• 함수 호출 시 선언한 타입이 아닌 인자가 입력되면 에러가 발생됨 (단, 다른 타입의 인자가 2개일 경우 첫 번재 인자만 에러가 난 것으로 표시됨)

Optional Parameter

function multiplyOrReturn(x: number, y?: number) {
  if (y) return x * y;
  else return x;
}
console.log(multiplyOrReturn(2, 10)); // O
console.log(multiplyOrReturn(2)); // O

함수의 매개변수의 타입을 선언할 때 ?을 붙여 해당 매개변수가 쓰여도 되고, 쓰이지 않아도 되도록 선언해줄 수 있다.

매개변수 기본값

function multiplyOrReturn2(x: number, y: number = 20) {
  return x * y;
}
console.log(multiplyOrReturn2(2, 10)); // 20
console.log(multiplyOrReturn2(2)); // 40

매개변수에 기본값을 넣으면 인자를 넣지 않아도 된다. 인자를 넣어줄 경우 기본값을 덮어씌운다.

매개변수가 무한개라면?

function getInfinityParams(...args: string[]) {
  return args.map((x) => `너무 좋아 ${x}`);
}
console.log(getInfinityParams('태연', '아이유', '블랙핑크'));

함수의 매개변수에 args라는 것이 있다. 여기에는 우리가 받은 인자들이 배열 형태로 존재한다. 그래서 인자를 많이 넣어줘도 손쉽게 처리를 할 수 있다.

반환값의 타입 선언하기

function addTwoNumbers(x: number, y: number) {
  return x + y;
}

function randomNumer() {
  return Math.random() > 0.5 ? '랜덤' : 10;
}

addTwoNumbers 함수는 number 타입을 리턴한다고 추론한다. number 타입인 x와 y를 더했기 때문이다.
randomNumber 함수를 보자. 이 함수는 '랜덤'과 10 중 하나를 반환한다. 타입스크립트는 똑똑하게 유니언 형태로 '랜덤' | 10이라고 추론한다.

이렇게 타입스크립트가 타입을 추론하도록 하는 경우도 있지만 우리가 명시적으로 반환 타입을 선언해줄 수도 있다.

function subtract(x: number, y: number): number {
  return x - y;
  // return 'dd'; // string으로 반환하려고 하면 에러
}

다른 타입을 반환하면?

number 타입으로 반환이 된다라고 명시해줬기 때문에 다른 타입을 반환하면 에러가 발생한다.

function subtract(x: number, y: number): number {
  return 'dd'; // 에러
}

화살표 함수에서의 반환값 선언하기

const arrow = (x: number, y: number): number => {
  return x + y;
};

특수 반환 타입 (void, never)

void의 의미는 아무 것도 반환하지 않느다는 의미다. 따라서 return 문을 입력했을 때 에러가 발생한다.

function doNotReturn(): void {
  console.log('난 반환하지 않아');
}
doNotReturn();

never 타입을 반환하는 경우

반환하는 상황(함수가 끝나지 않는 상황) 만들지 않으면 never 타입을 반환할 수 있다.

function throwError(): never {
  while (true) {}
}

function throwError2(): never {
  throw Error();
}

후기

함수의 매개변수에 타입을 선언하는 방법을 배웠는데 매개변수도 어떻게 보면 일단 primitive에 타입을 선언하는 것과 유사한데 따로 타입을 내가 원하는 이름으로 선언해줄 수 없을까? 라는 생각이 들었다.