[함수 다루기] 09. Arguments

함수를 호출할 때 파라미터로 전달하는 값, 아규먼트를 다루는 방법

// arguments
function printArguments(a, b, c) {
  console.log(a);
  console.log(b);
  console.log(c);
  console.log(arguments)
  console.log(--------------------);
}

printArguments('Young', 'Mark', 'Koby');
printArguments('Captain');
printArguments('Jayden','Scott');
printArguments('Suri', 'Jack', 'Joy', 'Noel');

일단 여기 파라미터 세 개를 활용해서 함수를 호출할 때 아규먼트 세 개를 전달하면 순서대로 각 값을 콘솔에 출력해주는 함수가 있다. 함수를 선언할 때 외부로부터 값을 전달 받기 위해서 이 소괄호 안에 작성하는 요소를 파라미터, 그리고 함수를 호출할 때 파라미터로 전달하는 값을 아규먼트라고 한다.

코드를 실행하면 함수를 호출할 때 전달했던 'Young', 'Mark', 'Koby'가 각각 콘솔에 출력되는 것을 확인할 수 있다.

그런데 이렇게 만든 함수는 호출할 때 꼭 세 개의 아규먼트를 작성해 주어야 하는 문제가 있다.

 

만약 아규먼트를 한 개나 두 개를 전달하게 되면 아무런 값도 전달 받지 못한 파라미터가 undefined 값을 갖고 동작하게 되고 반대로 세 개보다 많은 아규먼트를 전달하게 되면 세 개 이후에 전달된 값은 그냥 무시되어버리는 문제가 발생한다.

 

이렇게 전달되는 아규먼트의 패턴이 다양할 때 아규먼트가 한 개가 전달되면 한 개만 출력하고 네 개가 전달되면 네 개 모두를 출력하도록 아규먼트 개수에 따라 유연하게 동작하는 함수를 만들려면 자바스크립트에서 함수를 선언할 때 함수 내부에서는 arguments라는 특별한 객체를 사용할 수 있다. arguements를 콘솔에 출력하면 파라미터와 관계없이 함수를 호출할 때 전달한 아규먼트들이 대괄호 안에 각 요소로 담겨있는 모습을 확인할 수 있다.

 

arguements 객체는 배열과 비슷한 모양을 하고 있긴 하지만 모양만 비슷하고 배열의 메소드는 사용할 수 없는 유사 배열이다. 그래도 length 프로퍼티로 아규먼트 개수를 확인할 수도 있고 인덱싱을 통해서 아규먼트 하나하나에 접근을 한다거나 혹은 for...of 문을 통해서 반복 작업도 할 수 있기 때문에 arguments 객체를 활용하면 호출할 때 전달되는 아규먼트에 따라 유연하게 동작하는 함수를 만들어 낼 수도 있다.

 

마지막으로 한 가지 주의해야 할 부분은 arguments라는 객체가 함수 내부에 특정한 기능으로 존재하기 때문에 파라미터의 이름을 arguments로 짓는다거나 함수 내부에서 arguments라는 이름의 변수나 함수를 만드는 것도 피해야 한다.