[TypeScript] #4 함수

📌 함수

선택적 매개변수

함수의 매개변수를 옵셔널로 지정할 수 있다.

function hello(name: string) {
  return `Hello, ${name || "world"}`;
}

const result = hello(); // Error! 1개의 매개변수가 필요

이 경우 name이 인자로 들어올 경우 name, 아닐 경우 world로 return을 나눠줬다 하더라도, 1개의 매개변수가 필요하다는 Error를 띄운다.

function hello(name?: string) {
  return `Hello, ${name || "world"}`;
}

const result = hello();

name을 선택적 매개변수로 만든다.
이 때, name은 undefined 타입이거나, string 타입!

function hello(name: string, age?: number): string {
  if (age !== undefined) {
    return `Hello, ${name}. You are ${age}.`
  } else {
    return `Hello, ${name}`;
  }
}

const result = hello();

이름과 나이를 받아 문자열을 리턴해주는 함수
이때 name은 필수 매개변수, age는 선택적 매개변수이다.

❗️ 선택적 매개변수가 필수 매개변수보다 앞에 오게 되면 Error가 발생한다!

만약 age를 앞에 두고 사용하고 싶다면 아래와 같이 명시적으로 undefined를 전달해야 한다.

function hello(age: number | undefined, name: string): string {
  if (age !== undefined) {
    return `Hello, ${name}. You are ${age}.`
  } else {
    return `Hello, ${name}`;
  }
}

const result = hello();

나머지 매개변수 (rest parameter)

function add(...nums: number[]) {
  return nums.reduce((result, num) => result + num, 0);
}

add(1, 2, 3) // 6

나머지 매개변수는 전달받는 개수가 매번 달라질 수 있다.

this

interface User {
  name: string;
}

const Sam: User = {name:'Sam'}

function showName(this:User, age:number, gender:'m'|'f') {
  console.log(this.name, age, gender)
}

const a = showName.bind(Sam);
a(30, 'm');

타입스크립트에서 this의 타입을 정할 땐 함수의 첫번째 매개변수 자리에 this의 타입을 입력해주면 된다.

오버로드

전달받은 매개변수의 개수나, 타입에 따라 다른 동작을 하도록 하는 것

interface User {
  name: string;
  age: number;
}

function join(name: string, age:number | string): User | string {
  if (typeof age === "number") {
    return {
      name,
      age,
    };
  } else {
    return "나이는 숫자로 입력해주세요."
  }
}

const sam: user = join("Sam", 30); // Error : Type 'string | User' is not assignable to type 'User'. Type 'string' is not assignable to type 'User'.
const jane: string = join("Jane", "30"); // Error

age가 number로 들어오면 User타입의 객체를 리턴하고, string으로 들어오면 string을 리턴해주는 함수!

코드 상에는 age의 타입에 따라 분기가 되어있지만 type만 보았을 때는 그렇지 않은 것

매개변수의 타입에 따라 리턴해주는 타입이 다를 땐, 오버로드를 사용!

interface User {
  name: string;
  age: number;
}

function join(name: string, age: string): string;
function join(name: string, age: number): User;
function join(name: string, age:number | string): User | string {
  if (typeof age === "number") {
    return {
      name,
      age,
    };
  } else {
    return "나이는 숫자로 입력해주세요."
  }
}

const sam: user = join("Sam", 30);
const jane: string = join("Jane", "30");

age가 number일 때 User 반환,
age가 string일 때 string 반환