[TypeScript] 함수에서 type 지정하기2

🏕 optional parameter

함수의 매개변수의 갯수보다 적게 인자를 작성할 수 있다.

  //optional parameter
  function printName(firstName: string, lastName:string){
    console.log(firstName);
    console.log(lastName);
  }
  printName("Joah", "Kim");
  printName("Steve"); //error 2개의 인수가 필요한데 1개만 가져왔습니다.

위의 코드에서 성과 이름을 받아오는 매개변수이지만 인자를 한 개만 넣었을 때 에러가 발생한다. 정해진 인자 갯수대로 인자를 전달해야 하는데 그렇지 않아 에러를 발생시킨 것이다. 또한 string 타입이 아닌 다른 타입을 인자로 전달해도 에러가 발생한다.

이때 매개변수의 갯수보다 인자를 적게 넣을 수 있게 옵션을 제공하는 것이 optional parameter이다.

  //optional parameter
  function printName(firstName: string, lastName?:string){
    console.log(firstName);
    console.log(lastName);
  }
  printName("Joah", "Kim"); //Joah //Kim
  printName("Steve"); //Steve //undefined
  printName("Anna", undefined); //Anna //undefined

두 번째 인자가 전달될 수도 있고 전달이 안될수도 있다라는 뜻으로 두 번째 매개변수 자리에 물음표를 붙이면 된다.

두 번째 인자는 string 또는 undefined만 올 수 있다.

---

🏕 default parameter

인자로 아무런 것도 전달하지 않고 기본값을 출력하고 싶다면 디폴트 값을 지정할 수 있다.

  function printMessage(message: string) {
    console.log(message);
  }
  printMessage();//error 1개의 인수가 필요한데 0개를 가져왔습니다.

이때 매개변수의 타입 뒤에 "default message"를 할당하면 에러 없이 콘솔에 해당 문자가 출력된다.

  function printMessage(message: string = "default message") {
    console.log(message);
  }
  printMessage();// default message

인자로 아무런 것도 전달하지 않아도 optional parameter처럼 자동적으로 디폴트 값이 전달된다.

optional parameter와 비슷하지만,
optional parameter는 전달되지 않은 값은 undefined로 반환할 수도 있다.
하지만 default parameter는 인자를 전달하지 않으면 기본 값으로 설정된 값을 출력한다.

---

🏕 spread parameter

인자 갯수의 제한없이 받아오는 모든 인자들을 배열 형태로 받아온다.

  //rest parameter
  function addNumbers(...num: number[]): number {
    return num.reduce((a, b) => a + b);
  }
  console.log(addNumbers(1,2,3,4,5,6))//21

spread 연산자를 사용하여 전달되는 모든 인자들을 받아오고
숫자 타입의 배열로 받아온다.
즉, 전달하는 모든 숫자들을 배열의 요소로 받아온다.

  //rest parameter
  function addString(...num: number[]): number {
    return num.reduce((a, b) => a + b);
  }
  console.log(addNumbers(1, 2, 3, 4, 5, 6));

문자열도 가능하다

  //rest parameter
  function addStrings(...str: string[]): string {
    return str.join(" ");
  }
  console.log(addStrings("안녕하세요", "저는", "누구입니다."));
  //안녕하세요 저는 누구입니다.