[JavaScript] 가변 인자 함수

가변 인자 함수

자바스크립트

가변 인자 함수는 매개변수의 최대 갯수가 지정되지 않은 함수를 의미합니다.

sum(10, 20, 30, ...);

가변 인자 함수를 이용해 위와 같이 인자의 갯수 제한이 없는 함수를 작성할 수 있습니다.

arguments 객체

가변 인자 함수를 작성하는 가장 기본적인 방법은 arguments 객체를 사용하는 것입니다.

function sum() {
  console.log('length: ', arguments.length);
  console.log('index 1: ', arguments[1]);
}

sum(10, 20);

위 코드의 실행 결과는 다음과 같습니다.

length:  2
index 1:  20

arguments 객체에 대하여

arguments 객체는 function 함수에서 접근 가능한 지역 변수이며, 이를 이용해서 함수 내부에서 인수에 접근할 수 있습니다. 세 개의 인수를 전달받았다면 다음과 같이 각각의 인수에 접근할 수 있습니다.

arguments[0]
arguments[1]
arguments[2]

또한, arguments를 이용해 전달받은 인수의 값을 변경할 수 있습니다. 변경된 값은 arguments를 통해 접근할 때만 유효하며, 인수 원본의 값을 변경하지는 못합니다.

arguments[0] = 'Change Value';

arguments는 array like 객체로, Array 타입이 아닙니다. 하지만, Array.from() 메소드 또는 spread 연산자를 사용해 Array 타입으로 변경할 수도 있습니다.

const args = Array.from(arguments);
const args = [...arguments];

인수의 갯수에 따라 다른 동작하기

가변인자를 이용하면 전달받은 인수의 갯수에 따라 다른 동작을 하도록 함수를 정의할 수도 있습니다.

function test() {
  if (arguments.length === 0) {
    return 0;
  } else if (arguments.length === 1) {
    return 1;
  } else if (arguments.length === 2) {
    return 2;
  } else {
    return -1;
  }
}

spread 연산자를 이용한 가변인자 함수

arguments 객체는 function으로 정의한 함수에서만 사용할 수 있습니다.

array function에서는 가변인자 함수를 작성하기 위해 spread 연산자를 사용할 수 있습니다.

const test = (...args) => {
  if (args.length === 0) {
    return 0;
  } else if (args.length === 1) {
    return 1;
  } else if (args.length === 2) {
    return 2;
  } else {
    return -1;
  }
}