자바스크립트(ES6)에서는 기본 매개변수(Default Parameters) 기능을 통해 함수 매개변수에 기본값을 손쉽게 설정할 수 있습니다. 이를 활용하면 호출 시 인자가 전달되지 않거나 undefined가 넘어올 경우, 형식 매개변수가 미리 정의된 기본값으로 초기화됩니다.
기본 매개변수의 동작 원리
기본 매개변수는 다음과 같은 경우에만 적용됩니다.
- 함수 호출 시 해당 인자가 아예 전달되지 않았을 때
- 인자로
undefined가 명시적으로 전달되었을 때
반면 null, 0, 빈 문자열 등이 전달되면 기본값이 아니라 전달된 값이 그대로 사용되므로 주의해야 합니다.
예제 코드
아래 예제에서 증가량을 나타내는 두 번째 매개변수 inc의 기본값을 1로 설정했습니다.
<html>
<body>
<script>
// inc의 기본값은 1로 설정
function inc(val1, inc = 1) {
return val1 + inc;
}
document.write(inc(10, 10)); // 인자를 모두 전달
document.write("<br>");
document.write(inc(10)); // 두 번째 인자 생략 → 기본값 1 사용
</script>
</body>
</html>실행 결과
20 11
첫 번째 호출인 inc(10, 10)은 두 개의 인자를 모두 전달했으므로 10 + 10 = 20이 출력됩니다. 반면 두 번째 호출인 inc(10)은 두 번째 인자가 생략되어 기본값 1이 적용되어 10 + 1 = 11이 출력됩니다.
정리
기본 매개변수를 사용하면 함수 내부에서 typeof 검사나 조건문으로 인자 존재 여부를 일일이 확인할 필요가 없어 코드가 간결하고 가독성이 높아집니다. 선택적인 옵션 값이나 설정값을 처리할 때 특히 유용한 ES6 문법입니다.