생활코딩 자바스크립트 기본 - 함수지향 (arguments)

본 게시글은 인프런 강의 "생활코딩 - 자바스크립트(JavaScript) 기본"를 보고 공부한 내용을 정리하고 있습니다.

https://www.inflearn.com/course/%EC%A7%80%EB%B0%94%EC%8A%A4%ED%81%AC%EB%A6%BD%ED%8A%B8-%EC%96%B8%EC%96%B4-%EA%B8%B0%EB%B3%B8/dashboard

[무료] 생활코딩 - 자바스크립트(JavaScript) 기본 - 인프런 | 강의

---

arguments

함수에는 인자(argument)라는 변수에 담긴 숨겨진 유사 배열이 있다. 이 배열에는 함수를 호출할 때 입력한 인자가 담겨있다.

function sum(){
    var i, _sum = 0;
    for(i = 0; i < arguments.length; i++){
        document.write(i+' : '+arguments[i]+'<br />');
        _sum += arguments[i];
    }
    return _sum;
}
document.write('result : ' + sum(1,2,3,4));

document.write를 보면 sum함수에 1,2,3,4라는 인자를 넣었습니다.

하지만 sum함수에는 매개변수의 정의가 보이지 않습니다.

자바스크립트의 경우 함수에서 매개변수를 정의하지 않아도 인자의 값을 마음대로 지정해도 error가 나지 않는다.

 

그래서 for문에서 argument.length가 4가 나올수 있다.

i개 0인 for문에서는 첫번째 인자인 1이 출력되고, _sum에 더해진다.

이러한 과정이 반복한다.

다음 코드의 출력은 다음이다.

0 : 1
1 : 2
2 : 3
3 : 4
result : 10

 

매개변수의 수

 

function zero(){
    console.log(
        'zero.length', zero.length,
        'arguments', arguments.length
    );
}
zero(); // zero.length 0 arguments 0
function one(arg1){
    console.log(
        'one.length', one.length,
        'arguments', arguments.length
    );
}
one('val1', 'val2');  // one.length 1 arguments 2

function two(arg1, arg2){
    console.log(
        'two.length', two.length,
        'arguments', arguments.length
    );
}
two('val1');  // two.length 2 arguments 1

함수 one을 보면 매개변수는 1개이고, 인자는 2개이다.

함수 two를 보면 매개변수는 2개이고, 인자는 1개이다.

오류는 나오지 않지만, 의도와 다른 행동이기 때문에 이런 경우 error를 볼수 있게 만드는게 적절하다.