함수 타입

woodstock·2024년 1월 27일
0
post-thumbnail

함수의 타입을 정의하는 방법

함수의 타입은 매개 변수와 반환값의 타입으로 결정된다.

// 함수를 설명하는 가장 좋은 방법
// 어떤 매개변수를 받고, 어떤 결과값을 반환하는지 설명
function func(a: number, b: number): number {
  return a + b;
}

함수의 반환값 타입은 자동으로 추론되기 때문에 다음과 같이 생략해도 된다.

function func(a: number, b: number) {
  return a + b;
}

화살표 함수 타입 정의하기

const add = (a: number, b: number): number => a + b;
const add = (a: number, b: number) => a + b;

매개변수 기본값 설정하기

함수의 매개변수에 기본값이 설정되어있으면 타입이 자동으로 추론되며, 이 경우 타입 정의를 생략해도 된다.

function introduce(name = "woodstock") {
  console.log(`name : ${name}`);
}


이 때, 기본값과 다른 타입으로 매개변수의 타입을 정의하거나 인수를 전달하면 다음과 같이 오류가 발생한다.


선택적 매개변수 설정하기

매개변수의 이름뒤에 ?를 붙여주면 선택적 매개변수가 되어 생략이 가능하다.

function introduce(name = "woodstock", mbti?: "ESTJ") {
  console.log(`name : ${name}`);
  console.log(`MBTI : ${mbti}`);
}

introduce("woodstock", "ESTJ");
introduce("woodstock");


선택적 매개변수의 타입은 자동으로 undefined와 유니온 된 타입으로 추론된다.


따라서 이 값을 지정한 타입의 값으로 기대하고 사용하려면 다음과 같이 타입 좁히기가 필요하다.

function introduce(name = "woodstock", mbti?: "ESTJ", hp?: number) {
  console.log(`name : ${name}`);
  console.log(`MBTI : ${mbti}`);
  if (typeof hp === "number") {
    console.log(`HP : ${hp + 30}`);
  }
}


또한, 선택적 매개변수는 필수 매개변수 앞에 올 수 없고 반드시 뒤에 배치해야 한다.


나머지 매개변수

getSum함수는 나머지 매개변수 restnumber타입의 인수들을 담은 배열을 전달받는다.

function getSum(...rest) {
  let sum = 0;
  rest.forEach((it) => (sum += it));
  return sum;
}

rest파라미터(나머지 매개변수)의 타입은 다음과 같이 정의할 수 있다.


만약, 나머지 매개변수의 길이를 고정하고 싶다면 아래와 같이 튜플 타입을 이용하면 된다.

function getSum(...rest: [number, number, number]) {
  let sum = 0;
  rest.forEach((it) => (sum += it));
  return sum;
}

profile
해내는 사람

0개의 댓글