가변인자, arguments 객체란?

가변인자란?

 

가변 인자 함수는 전달받는 매개변수의 개수가 고정되지 않은 함수를 말합니다. 즉, 호출 시 다양한 개수의 인자를 받아 처리할 수 있습니다. 일반적으로 가변 인자는 arguments 객체나 스프레드 연산자(...)로 처리합니다

 

 화살표 함수에서 가변 인자 사용 방법

화살표 함수는 일반 함수와 달리 arguments 객체를 사용할 수 없으므로, 스프레드 연산자(...args)를 사용해야 합니다

 

const sum = (...args) => args.reduce((acc, val) => acc + val, 0);

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

 

 

• 스프레드 연산자: args는 배열 형태로 모든 인자를 받으며, reduce로 합계를 계산합니다.
• 화살표 함수 내부에서는 arguments가 없으므로, 반드시 스프레드 연산자를 사용해야 합니다

 

스프레드 연산자 사용 예제

 

 

화살표 함수에서 스프레드 연산자를 사용하면 여러 개의 인자를 배열로 묶어 손쉽게 처리할 수 있습니다. 아래는 가변 인자 합계를 구하는 화살표 함수 예제입니다.

 

// 스프레드 연산자를 이용한 화살표 함수
const sum = (...numbers) => numbers.reduce((total, num) => total + num, 0);

console.log(sum(1, 2, 3, 4)); // 10
console.log(sum(10, 20, 30)); // 60

 

1. ...numbers는 스프레드 연산자로, 함수에 전달된 모든 인자를 배열로 묶습니다.
2. reduce 메소드를 사용해 배열의 모든 값을 합산합니다.
3. numbers가 빈 배열일 경우, 초기값 0을 반환합니다.

이 예제처럼 스프레드 연산자는 가변 인자 처리에 유용하며, 특히 화살표 함수에서 arguments 객체 대신 사용됩니다

 

arguments 객체란?

 

arguments 객체는 자바스크립트의 함수 내에서 사용할 수 있는 배열과 유사한 객체로, 함수 호출 시 전달된 모든 인자를 담고 있습니다. 이 객체를 사용하면 함수 정의에 명시되지 않은 매개변수도 다룰 수 있습니다

 

특징

 

배열 유사 객체

• length 프로퍼티를 가지며, 배열처럼 인덱스로 접근할 수 있습니다.

function showArgs() {
  console.log(arguments[0]); // 첫 번째 인자
  console.log(arguments.length); // 인자 개수 출력
}
showArgs('a', 'b'); // 'a', 2

 

Array 메서드 직접 사용 불가

• 배열이 아니기 때문에 map, forEach 같은 배열 메서드를 바로 사용할 수 없습니다.
• 배열로 변환하려면 Array.from() 또는 스프레드 연산자를 사용합니다.

function convertToArray() {
  const argsArray = Array.from(arguments);
  console.log(argsArray);
}
convertToArray(1, 2, 3); // [1, 2, 3]

 

화살표 함수에서는 사용 불가

• 화살표 함수는 자체적인 arguments 객체를 가지지 않기 때문에, 대신 나머지 매개변수(...args)를 사용해야 합니다

유용한 활용 예시

• 함수에 전달된 인자의 개수나 특정 인자 유무를 쉽게 확인할 수 있습니다

 

주의사항

• arguments 객체는 ES6에서 나머지 매개변수(...rest)로 대체하는 것이 권장됩니다. 이는 가독성과 성능 면에서 더 효율적입니다