arguments는 전달받는 함수의 인자를 나타내는 유사 배열입니다. 여기서 유사 배열이라는 것은 배열은 아니지만 배열과 비슷하게 사용할 수 있는 객체를 의미합니다.
매개변수 개수가 달라도 오류가 나지 않음
// 매개변수가 없음
function sum() {
console.log(1);
};
// 오류가 나지 않음
sum(1,2,3,4);
위를 보면 함수 sum에는 매개변수를 아무것도 받지 않도록 선언되어있지만 함수를 호출할 때는 무려 4개의 전달 인자를 받고 있습니다. 그럼에도 불구하고 아무 오류 없이 1이 출력되어 정상 동작하는 것을 확인할 수 있습니다.
이처럼 자바스크립트에서 함수는 전달 인자의 개수에 상관없이 동작됩니다. 그리고 이 전달 인자들은 arguments라는 인스턴스에 저장됩니다.
arguments 예시
// 매개변수 정의 없이 인자의 값의 합을 호출
function sum() {
var num = 0;
for (var i = 0; i < arguments.length; i++) {
num += arguments[i];
}
return num;
}
console.log(sum(1,2,3,4));
위와 같이 sum은 매개변수가 없지만 전달 인자로 받은 값들을 arguments에 담아 for문을 이용하여 인자들의 총합을 반환하고 있습니다. arguments를 사용하는 방법은 다음과 같습니다.
1. 전달 인자들을 배열처럼 argument [index]와 같은 형식으로 각각의 전달 인자들을 사용할 수 있습니다.
2. arguments.length는 전달 인자들의 개수를 반환합니다.
결과
10
함수를 선언할 때 매개변수를 설정해 놓아도 함수 호출 시에 전달받은 인자들은 전부 arguments에 저장됩니다. arguments를 이용하면 인자의 타입과 개수에 상관없이 동적으로 함수에 인자들을 전달할 수 있습니다.
주의점
arguments는 배열이 아니기 때문에 배열과 관련한 메서드를 사용할 수 없습니다. 따라서 배열처럼 여러 가지 조작을 하기 위해서는 arguments를 배열로 바꾸어서 사용해야 합니다. ES6에서는 arguments를 배열로 할 수 있는 문법이 추가되었습니다.
[JavaScript] 자바스크립트 프로토타입(prototype)이란? (0) | 2020.11.01 |
---|---|
[JavaScript] 자바스크립트 Array 메서드 정리 (0) | 2020.10.25 |
[JavaScript] 자바스크립트 this와 apply, call 함수 (0) | 2020.10.24 |
[JavaScript] 자바스크립트 이벤트의 정의와 이벤트 등록 방법 (0) | 2020.10.24 |
[JavaScript] 자바스크립트로 DOM 접근하기 (2) | 2020.10.23 |