[콜럼Vue스] Parameter

기본 파라미터 (Default Parameter) & 가변 파라미터 (Reset Parameter) 는 ES6에서 함수 매개변수를 더욱 유연하게 사용할 수 있도록 도입된 기능임

 

1. 기본 파라미터 (Default Parameter)

기본 파라미터는 함수 호출 시 특정 인자가 전달되지 않았을 때 미리 정의된 기본값을 사용할 수 있게 해주는 기능임. 예전에는 함수 안에서 매개변수가 undefined인지 확인하고 값을 할당하는 식으로 처리했지만, ES6부터는 더 간결하게 기본값을 지정할 수 있음.

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

greet(); // Hello, Guest! (인자가 없을 경우 기본값 사용)
greet("Jerry"); // Hello, Jerry! (인자가 있으면 해당 값 사용)

함수 호출 시 name 파라미터가 제공되지 않으면 기본값 "Guest"가 사용됨. 하지만 인자가 전달되면 해당 인자가 사용됨.

 

기본 파라미터 활용:

• 기본 파라미터는 매개변수가 필요 없는 함수를 호출할 때 기본 동작을 정의할 수 있어 코드의 안정성을 높여 줌.
• 다양한 상황에 맞춰 동적 파라미터를 설정할 수 있음.

---

2. 가변 파라미터 (Rest Parameter)

가변 파라미터는 함수에 전달된 인자의 개수에 상관없이 여러 개의 인자를 하나의 배열로 묶어 처리할 수 있는 기능임. 이를 통해 고정된 개수가 아닌, 가변적인 개수의 인자를 함수에서 처리할 수 있음.

function sum(...numbers) {
  return numbers.reduce((acc, current) => acc + current, 0);
}

console.log(sum(1, 2, 3)); // 6
console.log(sum(10, 20, 30, 40)); // 100

 

• 기능 설명: ...numbers는 함수가 받는 모든 인자를 배열로 묶어 처리함. numbers는 배열로서, reduce()를 사용해 배열의 모든 요소를 더하는 기능을 수행함.
• 이처럼 가변 길이의 인자를 처리할 때 유용함.

가변 파라미터의 특징:

• 가변 파라미터는 항상 마지막 매개변수로 선언해야 함.
• 가변 파라미터 이전에 다른 고정된 인자들이 올 수 있음.

function multiply(factor, ...numbers) {
  return numbers.map(num => num * factor);
}

console.log(multiply(2, 1, 2, 3)); // [2, 4, 6] (factor로 각 인자들을 곱함)

 

기능 설명: 첫 번째 인자 factor는 고정된 값으로 사용되고, 나머지 인자들은 모두 numbers 배열로 모아져서 처리됨.