함수 타입

함수에서 타입을 저의 할 때에는 매개변수 의 타입을 지정해주고 반환값 에 맞는 타입을 지정해주면 된다.

( 전에 배운 타입추론 에 의해 함수의 반환값 타입은 생략이 가능하다. 😎 )

function func(a: number, b: number) {
  return a + b;
  
 // arrow function
const add = (a: number, b: number) => a + b;
}

선택적 매개변수

함수에서 매개변수를 받을때 필수로 받지 않아도 되는 경우에 사용한다.

function introduce(name = "jaehan", weight?: number) {
  console.log(`name : ${name}`);
  console.log(`weight : ${weight}`);
}

introduce("jaehan", 65); // ✅ 성공

introduce("jaehan"); // ✅ 성공

주의 사항

• undefined 값이 올 수 있으므로, 값이 있는지 확인 후 사용해야 한다.

function introduce(name = "jaehan", weight?: number) {
  console.log(`name : ${name}`);
  if (!!weight) { // 조건문이 없으면, Object is possibly 'undefined'. 에러 발생
    console.log(`weight : ${weight + 10}`);
  }
}

introduce("jaehan", 65); // ✅ 성공

• 선택적 매개변수는 필수 매개변수 앞에 올 수 없다.

function introduce(name = "jaehan", weight?: number, age: number) { // ❌error
	
  console.log(`name : ${name}`);
  if (!!weight) {
    console.log(`weight : ${weight + 10}`);
  }
}

rest 매개변수

매개변수로 보내는 숫자들을 모두 더해주는 함수를 만들어보자

몇 개의 숫자가 올지 모르기 때문에 rest 매개변수를 사용한다.

function getSum(...rest: number[]) { // [1,2,3] / [1,2,3,4] 형태로 전달된다.
  let sum = 0;
  rest.forEach((it) => (sum += it));
  return sum;
}

getSum(1, 2, 3)    // 6
getSum(1, 2, 3, 4) // 10

함수 타입 표현식

함수도 타입 별칭을 만들어서 타입을 지정할 수 있는데, 이를 함수 타입 표현식 이라고 부른다.

type Operation = (a: number, b: number) => number;

const add: Operation = (a, b) => a + b;
const sub: Operation = (a, b) => a - b;
const multiply: Operation = (a, b) => a * b;
const divide: Operation = (a, b) => a / b;

호출 시그니처

함수 타입 표현식과 동일하지만, 표현하는 방법이 조금 다르다.

type Operation2 = {
  (a: number, b: number): number;
};

const add2: Operation2 = (a, b) => a + b;
const sub2: Operation2 = (a, b) => a - b;
const multiply2: Operation2 = (a, b) => a * b;
const divide2: Operation2 = (a, b) => a / b;

함수 오버로딩

동일한 이름의 함수를 매개변수의 갯수 나 타입 에 따라 다르게 선언하는 것을 말한다.

💡 JavaScript 에서는 사용이 불가하고 TypeScript 에서만 사용 가능하다.

함수 오버로딩을 구현하려면 오버로드 시그니쳐 라는 것을 만들어줘야한다.

// fnc1. 매개변수가 1개이면 매개변수에 20을 곱하기
// fnc2. 매개변수가 3개이면 모든 매개변수 더하기

// 매개변수 별 함수 선언: 오버로드 시그니쳐 선언
function func(a: number): void;
function func(a: number, b: number, c: number): void;

// 구현부 : 구현 시그니처
function func(a: number, b?: number, c?: number) {
  if (typeof b === "number" && typeof c === "number") {
    console.log(a + b + c);
  } else {
    console.log(a * 20);
  }
}

func(1);
func(1,2,3);

참고
한 입 크기로 잘라먹는 타입스크립트