선택적 매개변수와 기본 매개변수
이번에는 함수를 더욱 유연하게 만들면서도 타입 안전성을 유지할 수 있도록 돕는 두 가지 중요한 개념, 바로 선택적 매개변수(Optional Parameters) 와 기본 매개변수(Default Parameters) 에 대해 깊이 있게 다루겠습니다. 이 기능들은 함수 호출 시 인자의 개수나 제공 여부를 조절해야 할 때 매우 유용합니다.
선택적 매개변수
때때로 함수를 호출할 때 모든 매개변수가 항상 필요한 것은 아닐 수 있습니다. 특정 매개변수가 존재할 수도 있고, 없을 수도 있는 상황에서 사용되는 것이 바로 선택적 매개변수입니다. 타입스크립트에서는 매개변수 이름 뒤에 물음표(?
)를 붙여 해당 매개변수가 선택적임을 나타냅니다.
// 사용자 정보를 요약하는 함수
function summarizeUser(name: string, email?: string, phone?: string): string {
let summary = `이름: ${name}`;
if (email) {
summary += `, 이메일: ${email}`;
}
if (phone) {
summary += `, 전화번호: ${phone}`;
}
return summary;
}
// 다양한 방식으로 함수 호출
console.log(summarizeUser("홍길동"));
// 출력: 이름: 홍길동
console.log(summarizeUser("김철수", "chulsu@example.com"));
// 출력: 이름: 김철수, 이메일: chulsu@example.com
console.log(summarizeUser("이영희", "yh@example.com", "010-1234-5678"));
// 출력: 이름: 이영희, 이메일: yh@example.com, 전화번호: 010-1234-5678
// 오류: 필수 매개변수를 누락할 수 없습니다.
// summarizeUser(); // Error: Expected 1-3 arguments, but got 0.
위 예시에서 email
과 phone
매개변수는 ?
가 붙어 있어 선택적입니다. 함수 내부에서는 이 매개변수들이 undefined
일 수 있음을 고려하여 조건문(if (email)
)으로 존재 여부를 확인하는 것이 일반적입니다.
중요한 규칙: 타입스크립트에서 선택적 매개변수는 항상 필수 매개변수 뒤에 위치해야 합니다. 만약 필수 매개변수 앞에 선택적 매개변수를 배치하려고 하면 컴파일 오류가 발생합니다.
// function invalidOrder(first?: string, second: string): void { // Error: Required parameter cannot follow an optional parameter.
// // ...
// }
이 규칙은 함수 호출 시 매개변수들의 의미를 명확하게 하고, 타입스크립트 컴파일러가 인자들을 올바르게 매핑할 수 있도록 돕습니다.
기본 매개변수
ES2015(ES6)부터 자바스크립트에서는 함수 매개변수에 기본 값(Default Value) 을 직접 할당하는 문법이 도입되었습니다. 타입스크립트도 이 기능을 완벽하게 지원합니다. 매개변수에 기본 값이 할당되면, 해당 매개변수는 자동으로 선택적 매개변수로 간주됩니다. 함수 호출 시 해당 인자를 제공하지 않으면, 지정된 기본 값이 사용됩니다.
// 메시지를 출력하는 함수 (기본 접두사 지정)
function logWithPrefix(message: string, prefix: string = "[INFO]"): void {
console.log(`${prefix} ${message}`);
}
// 기본값 사용
logWithPrefix("애플리케이션이 시작되었습니다.");
// 출력: [INFO] 애플리케이션이 시작되었습니다.
// 기본값 재정의
logWithPrefix("데이터베이스 연결 실패!", "[ERROR]");
// 출력: [ERROR] 데이터베이스 연결 실패!
// 다른 예시: 숫자의 거듭제곱 계산
function power(base: number, exponent: number = 2): number {
return base ** exponent;
}
console.log(power(5)); // 25 (5의 2제곱)
console.log(power(2, 3)); // 8 (2의 3제곱)
prefix: string = "[INFO]"
는 prefix
가 string
타입이며, 만약 함수 호출 시 prefix
인자가 제공되지 않으면 " [INFO]"
라는 기본 값을 사용한다는 의미입니다.
기본 매개변수의 장점
- 코드 간결성: 함수 내부에서
if (arg === undefined)
와 같은 기본값 할당 로직을 작성할 필요가 없어 코드가 더 간결해집니다. - 가독성: 함수 서명만으로 어떤 매개변수가 선택적이며 어떤 기본 값을 가지는지 명확하게 알 수 있습니다.
- 런타임 안전성:
undefined
값이 의도치 않게 사용되는 것을 줄여줍니다.
선택적 매개변수와 기본 매개변수의 순서
선택적 매개변수와 마찬가지로, 기본 매개변수 역시 필수 매개변수 뒤에 배치하는 것이 일반적입니다. 하지만, 기본 매개변수는 선택적 매개변수와 달리 필수 매개변수 중간에도 위치할 수 있습니다. 단, 이 경우 해당 기본 매개변수를 생략하려면 undefined
를 명시적으로 전달해야 합니다.
// 기본 매개변수 뒤에 필수 매개변수가 오는 경우 (가능은 하지만 권장되지 않음)
function createGreeting(
name: string = "Unknown",
message: string, // 필수 매개변수
salutation: string = "Hello"
): string {
return `${salutation}, ${name}! ${message}`;
}
// console.log(createGreeting("World")); // Error: 'message' 매개 변수에 대한 인수가 없습니다.
// 필수 매개변수 `message`를 생략할 수 없습니다.
// 기본 매개변수를 생략하려면 undefined를 전달해야 합니다.
console.log(createGreeting(undefined, "Have a great day!"));
// 출력: Hello, Unknown! Have a great day!
console.log(createGreeting("Alice", "Nice to meet you!", "Hi"));
// 출력: Hi, Alice! Nice to meet you!
이러한 혼합된 순서는 코드의 가독성을 해칠 수 있으므로, 일반적으로 모든 필수 매개변수를 먼저 배치하고 그 뒤에 선택적/기본 매개변수를 배치하는 것이 좋은 습관입니다.
선택적 매개변수와 기본 매개변수는 함수를 더 유연하게 만들면서도 타입스크립트의 강력한 타입 검사 이점을 유지할 수 있도록 돕는 중요한 기능입니다. 함수를 설계할 때 어떤 인자가 항상 필요한지, 어떤 인자는 선택적이며 기본값이 필요한지 잘 고려하여 이들을 적절히 활용하시길 바랍니다.