[JavaScript] JS에서 가변 인자 처리하기 (rest parameters, arguments 객체)

rest parameters

• ES6에서 도입되었으며 함수의 매개변수로 전달된 가변 개수의 인자를 배열 형태로 처리할 수 있는 기능
• 함수 정의에서 사용되며 스프레드 연산자('...')를 매개변수로 사용하여 구현 (C와 동일)

function exampleFunction(arg1, arg2, ...restArgs) {
    console.log(arg1);         // 첫 번째 인자
    console.log(arg2);         // 두 번째 인자
    console.log(restArgs);     // 나머지 인자들 (배열 형태)
}

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

console.log(sum(1, 2, 3));        // 6
console.log(sum(1, 2, 3, 4, 5));  // 15

 

위에 사용된 reduce 메서드에 대해 잠깐 설명하자면 배열의 각 요소를 순회하면서 하나의 값으로 축소하는 메서드이다.

array.reduce((accumulator, currentValue, currentIndex, array) => {
    // 축소 로직
}, initialValue);

• accumulator: 누적 값, 이전 호출에서 반환된 값으로 초기값(initialValue)가 있다면 첫 번째 호출에서 이 값이 사용되며, 없다면 배열의 첫 번째 요소가 이 값으로 사용된다.
• currentValue: 현재 배열의 요소
• currentIndex: 현재 요소의 인덱스 (선택적)
• array: reduce 메서드에 호출된 배열 (선택적)
• initialValue: 첫 번째 호출 시 'accumulator'의 초기 값으로 제공하지 않으면 배열의 첫 번째 요소가 사용됨 (선택적)

 

arguments 객체

• 함수 내에서 사용 가능한 특수한 객체로, 함수에 전달된 인자들을 배열 형태로 접근할 수 있게 해 줌
• rest parameters보다 불편하고, 배열 메서드를 직접 사용할 수 없어 현대적인 코드에서 잘 사용되지 않음

function exampleFunction() {
    console.log(arguments);  // 인자들을 담고 있는 arguments 객체
}

function multiply() {
    let result = 1;
    for (let i = 0; i < arguments.length; i++) {
        result *= arguments[i];
    }
    return result;
}

console.log(multiply(2, 3, 4));   // 24
console.log(multiply(1, 2, 3, 4, 5));  // 120

 

다음과 같이 arguments 객체의 요소를 수정하려고 해도 arguments 객체는 실제로 변경되지 않으며, 인수 값이 그대로 유지된 채로 반환한다.

function add() {
    let add = 1;
    for (let i = 0; i < arguments.length; i++) {
        arguments[i] += add;
    }
    return arguments;
}

console.log(add(2, 3, 4));   // [2, 3, 4] 실제로는 변경되지 않음
console.log(add(1, 2, 3, 4, 5));  // [1, 2, 3, 4, 5] 실제로는 변경되지 않음