TypeScript: Optional Parameter

dev_sang·2022년 6월 10일
0

TypeScript

목록 보기
2/7

함수에서 타입 사용하기

기존 자바스크립트 함수

// JavaScript
function jsAdd(num1, num2) {
    return num1 + num2;
  }

타입 스크립트 함수

// TypeScript
function add(num1: number, num2: number): number {
    return num1 + num2;
  }

→ 숫자 타입의 매개변수 num1, num2를 받아 숫자타입의 값을 반환한다.

Optional Parameter

함수(매개변수?: 타입)

function printName(firstName: string, lastName?: string) {
  console.log(firstName);
  console.log(lastName); // undefined
}

printName("SJ", "Lee"); // SJ Lee
printName("Bomi");      // Bomi undefined

함수 printName의 두번째 인자인 lastName에 값을 전달하지 않아도 에러가 나지 않는다.
lastName에 값을 전달하지 않을 경우 자동으로 undefined가 할당된다.

참고

Optional Parameter를 사용하지 않고 Optional Type으로 작성 시 두번째 인자에 값을 전달하지 않으면 에러가 난다.

function printName(firstName: string, lastName: string| undefined) {
  console.log(firstName);
  console.log(lastName); 
}

printName("SJ", "Lee"); 		// SJ Lee
printName("Bomi"); 				// ❗️ Expected 2 arguments, but got 1.
printName("Bomi", undefined);	// Bomi undefined

Default Parameter

함수(인자: 타입 = default로 나올 값)

  • default parameter설정 시 인자로 아무 값도 안넣었을 때 작성된 default값이 나온다.
function printMessage(message: string = "default meesage") {
    console.log(message);
  }
  printMessage(); // default meesage

Rest Parameter

함수( ...인자: 타입)
동일한 타입의 값을 개수 상관 없이 parameter로 받는다.
스프레드 연산자를 사용한다.

// parameter number를 여러개 받는데, 타입은 숫자로된 배열이다. 리턴값 타입은 숫자다.
function addNumbers(...numbers: number[]) {
    return numbers.reduce((a, b) => a + b); // 배열 총합 구하기
  }

console.log(addNumbers(1, 2, 3));
console.log(addNumbers(1, 2, 3, 4, 5, 6, 7));

이 포스트는 드림코딩 엘리님의 타입스크립트 강의를 복습하며 작성하였습니다.

profile
There is no reason for not trying.

0개의 댓글