파라미터와 옵셔널 파라미터 이해하기
함수를 호출할 때 파라미터를 활용하면, 입력받은 값에 따라 다양한 결괏값을 얻을 수 있다. 함수에 전달하는 값은 상황에 따라 달라질 수 있기 때문에, 파라미터를 통해 유동적으로 처리할 수 있다.
그렇다면, 파라미터가 있는 함수에 아무 값도 전달하지 않으면 어떻게 될까?
파라미터가 없는 경우의 동작
파라미터가 있는 함수에 값을 전달하지 않고 호출하면, 자바스크립트에서는 해당 파라미터가 undefined 값을 받게 된다.
예시
function greet(name) {
console.log("Hello, " + name);
}
greet(); // Hello, undefined 출력
위 코드를 보면, 함수 greet는 파라미터 name을 받지만, 호출할 때 아무 값도 전달하지 않았다. 이때, name은 자동으로 undefined 값을 받게 된다. 그래서 Hello, undefined라는 결과가 출력된다.
undefined가 나오는 다른 상황들
undefined가 나오는 상황은 몇 가지가 더 있다. 예를 들어, 변수를 선언만 하고 아무 값도 할당하지 않았을 때, 또는 함수에 리턴문이 없을 때도 undefined가 출력된다.
예시: 리턴문이 없는 경우
function sayHello() {
console.log("Hello");
}
console.log(sayHello()); // "Hello" 출력 후, undefined 출력
위 코드에서 sayHello 함수는 값을 리턴하지 않으므로, 호출한 결과는 자동으로 undefined가 된다. 이처럼 리턴값이 없는 함수도 호출할 때 undefined를 돌려준다.
옵셔널 파라미터 (Optional Parameters)
파라미터가 필수값은 아니고, 경우에 따라 기본값을 설정해 둘 수 있다. 이렇게 하면, 값을 전달하지 않아도 기본값이 자동으로 사용된다. 이를 옵셔널 파라미터 (Optional Parameters) 라고 부른다. 즉, 값을 전달하지 않으면 미리 설정된 기본값을 사용한다.
예시: 기본값이 설정된 파라미터
function greet(name = "친구") {
console.log("Hello, " + name);
}
greet(); // Hello, 친구 출력
greet("코딩"); // Hello, 코딩 출력
여기서 함수 greet는 파라미터 name에 기본값으로 "친구"를 설정했다. 따라서 호출 시에 값을 전달하지 않으면 기본값이 사용되어 Hello, 친구가 출력된다. 값을 전달할 경우에는 전달한 값을 사용하여 결과가 출력된다.
옵셔널 파라미터의 위치
옵셔널 파라미터는 가장 뒤에 위치해야 한다. 파라미터의 순서가 뒤죽박죽이면, 함수 호출 시 값이 제대로 전달되지 않거나 undefined 값이 생길 수 있다. 특히, 중간에 기본값이 설정된 파라미터가 있으면 전달 순서가 꼬일 수 있다.
잘못된 예시
function introduce(name, age = 25, city) {
console.log(name + "는 " + age + "살이고 " + city + "에 삽니다.");
}
introduce("철수", "서울"); // 철수는 서울살이고 undefined에 삽니다.
위 코드에서는 age에 기본값을 설정했지만, 중간에 위치해 있어서 함수 호출 시 순서가 밀리게 된다. 그래서 age에 "서울"이 전달되고, city는 undefined가 되어 결과가 엉망이 된다.
올바른 예시
function introduce(name, city, age = 25) {
console.log(name + "는 " + age + "살이고 " + city + "에 삽니다.");
}
introduce("철수", "서울"); // 철수는 25살이고 서울에 삽니다.
이렇게 옵셔널 파라미터는 뒤에 위치시켜야, 생략하더라도 문제가 생기지 않는다. 값이 제대로 전달되어 함수가 의도대로 동작한다.
요약
- 파라미터: 함수를 호출할 때 전달받는 값으로, 다양한 결과를 만들 수 있다.
- 값이 전달되지 않으면
undefined가 출력되며, 변수를 선언만 했을 때나 리턴문이 없는 함수에서도undefined가 발생한다.- 옵셔널 파라미터: 파라미터에 기본값을 설정하여, 값을 생략해도 기본값이 자동으로 사용되게 한다.
- 옵셔널 파라미터는 가장 뒤에 위치해야 순서가 꼬이지 않고 올바르게 동작한다.
파라미터와 옵셔널 파라미터를 잘 활용하면, 함수 호출 시 값이 전달되지 않거나 생략되었을 때도 안정적으로 동작하는 코드를 작성할 수 있다!
