[TypeScript] 선택적 매개변수와 기본 매개변수

선택적 매개변수와 기본 매개변수 (Optional and Default Parameters)

TypeScript에서는 함수의 모든 매개변수가 필수로 간주됩니다. 이는 호출 시 제공되지 않는 매개변수에 대해 TypeScript가 오류를 발생시킨다는 의미입니다. 하지만 매개변수를 선택적(Optional)으로 만들거나 기본(Default) 값을 설정할 수 있습니다.

기본 함수 정의

기본적으로 TypeScript에서 함수는 모든 매개변수를 필요로 합니다.

function buildName(firstName: string, lastName: string) {
    return `${firstName} ${lastName}`;
}

let result1 = buildName("Bob");                  // 오류, 매개변수가 부족합니다.
let result2 = buildName("Bob", "Adams", "Sr.");  // 오류, 매개변수가 너무 많습니다.
let result3 = buildName("Bob", "Adams");         // 정확합니다.

선택적 매개변수

매개변수를 선택적으로 만들려면 매개변수 이름 끝에 ?를 붙입니다.

function buildName(firstName: string, lastName?: string) {
    return lastName ? `${firstName} ${lastName}` : firstName;
}

let result1 = buildName("Bob");                  // 정확합니다.
let result2 = buildName("Bob", "Adams", "Sr.");  // 오류, 매개변수가 너무 많습니다.
let result3 = buildName("Bob", "Adams");         // 정확합니다.

기본 매개변수

매개변수에 기본 값을 설정하여, 사용자가 값을 제공하지 않거나 undefined를 제공할 때 기본 값을 사용할 수 있습니다.

function buildName(firstName: string, lastName: string = "Smith") {
    return `${firstName} ${lastName}`;
}

let result1 = buildName("Bob");                  // "Bob Smith" 반환
let result2 = buildName("Bob", undefined);       // "Bob Smith" 반환
let result3 = buildName("Bob", "Adams", "Sr.");  // 오류, 매개변수가 너무 많습니다.
let result4 = buildName("Bob", "Adams");         // "Bob Adams" 반환

기본 매개변수는 선택적 매개변수처럼 다룰 수 있으며, 필요한 경우 생략할 수 있습니다.

기본 매개변수가 앞에 오는 경우

기본 매개변수가 필수 매개변수보다 앞에 있을 경우, 사용자는 undefined를 명시적으로 전달해야 기본 값이 적용됩니다.

function buildName(firstName: string = "Will", lastName: string) {
    return `${firstName} ${lastName}`;
}

let result1 = buildName("Bob");                  // 오류, 매개변수가 부족합니다.
let result2 = buildName("Bob", "Adams", "Sr.");  // 오류, 매개변수가 너무 많습니다.
let result3 = buildName("Bob", "Adams");         // "Bob Adams" 반환
let result4 = buildName(undefined, "Adams");     // "Will Adams" 반환

나머지 매개변수 (Rest Parameters)

나머지 매개변수를 사용하면 함수가 임의의 수의 매개변수를 받을 수 있습니다. 이 매개변수들은 배열로 모아집니다.

function buildName(firstName: string, ...restOfName: string[]) {
    return `${firstName} ${restOfName.join(" ")}`;
}

// employeeName 은 "Joseph Samuel Lucas MacKinzie" 가 됩니다.
let employeeName = buildName("Joseph", "Samuel", "Lucas", "MacKinzie");

나머지 매개변수는 선택적 매개변수처럼 무한히 많은 인자를 받을 수 있습니다. 함수의 타입 정의에서도 나머지 매개변수를 사용할 수 있습니다.

function buildName(firstName: string, ...restOfName: string[]) {
    return `${firstName} ${restOfName.join(" ")}`;
}

let buildNameFun: (fname: string, ...rest: string[]) => string = buildName;

 

Reference

https://typescript-kr.github.io/pages/functions.html