[지식루프의 IT공부] 옵셔널 파라미터(Optional Parameter)

자바스크립트에서 옵셔널 파라미터(Optional Parameter)

옵셔널 파라미터는 함수에서 특정 매개변수가 필수가 아닌 경우 사용됩니다. 이를 통해 호출자가 필요에 따라 매개변수를 전달하거나 생략할 수 있습니다. 자바스크립트에서는 매개변수가 전달되지 않으면 undefined로 설정됩니다.

---

1. 기본적인 옵셔널 파라미터 사용법

function greet(name, greeting = "Hello") {
    console.log(`${greeting}, ${name}!`);
}

greet("John");              // Hello, John!
greet("Jane", "Hi");        // Hi, Jane!

• greeting은 기본값이 Hello로 설정된 옵셔널 파라미터입니다.
• greet("John")에서 greeting이 생략되었으므로 기본값 Hello가 사용됩니다.

---

2. 옵셔널 체이닝과 논리 연산자 활용

옵셔널 파라미터는 ||, ?? 등을 사용해 보다 유연하게 처리할 수 있습니다.

function displayMessage(message) {
    console.log(message || "Default message");
}

displayMessage("Welcome!"); // Welcome!
displayMessage();           // Default message

message가 undefined일 경우, || 연산자를 통해 기본 메시지를 출력합니다.

---

3. arguments 객체를 사용한 옵셔널 처리

function sum(a, b) {
    b = b || 0;
    return a + b;
}

console.log(sum(5));    // 5
console.log(sum(5, 10));// 15

• b가 전달되지 않으면 0이 기본값으로 설정됩니다.

---

4. 구조 분해 할당과 옵셔널 파라미터

function createUser({ name, age = 20 }) {
    console.log(`Name: ${name}, Age: ${age}`);
}

createUser({ name: "Alice" });   // Name: Alice, Age: 20
createUser({ name: "Bob", age: 30 }); // Name: Bob, Age: 30

• age는 객체에서 선택적으로 전달됩니다. 생략 시 기본값 20이 사용됩니다.

---

5. null과 undefined 구분 (ES6+)

function getData(value = "No Data") {
    console.log(value ?? "Default Value");
}

getData(null);            // null (??는 null도 값으로 인정)
getData(undefined);       // Default Value

• ?? 연산자는 null과 undefined를 구분하여 undefined일 때만 기본값을 사용합니다.

---

주요 포인트

• 기본값 설정 (=)을 통해 옵셔널 파라미터를 쉽게 구현 가능
• ||, ?? 연산자로 더 유연하게 처리 가능
• 객체 구조 분해를 활용해 직관적인 옵셔널 파라미터 처리 가능