JavaScript

arguments

함수에는 arguments라는 변수에 담긴 숨겨진 유사 배열이 있다. 이 배열에는 함수를 호출할 때 입력한 인자가 담겨있다. 아래 예제를 보자. 결과는 10이다.

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));

함수 sum은 인자로 전달된 값을 모두 더해서 리턴하는 함수다. 그런데 1행처럼 함수 sum은 인자에 대한 정의하가 없다. 하지만 마지막 라인에서는 4개의 인자를 함수 sum으로 전달하고 있다. 함수의 정의부분에서 인자에 대한 구현이 없음에도 인자를 전달 할 수 있는 것은 왜 그럴까? 그것은 arguments라는 특수한 배열이 있기 때문이다.

arguments는 함수안에서 사용할 수 있도록 그 이름이나 특성이 약속되어 있는 일종의 배열이다. arguments[0]은 함수로 전달된 첫번째 인자를 알아낼 수 있다. 또 arguments.length를 이용해서 함수로 전달된 인자의 개수를 알아낼 수도 있다. 이러한 특성에 반복문을 결합하면 함수로 전달된 인자의 값을 순차적으로 가져올 수 있다. 그 값을 더해서 리턴하면 인자로 전달된 값에 대한 총합을 구하는 함수를 만들 수 있다.

arguments는 사실 배열은 아니다. 실제로는 arguments 객체의 인스턴스다.

매개변수의 수

매개변수와 관련된 두가지 수가 있다. 하나는 함수.length, 다른 하나는 arguments.length이다. arguments.length는 함수로 전달된 실제 인자의 수를 의미하고, 함수.length는 함수에 정의된 인자의 수를 의미한다. 아래의 코드를 보자.

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

 

댓글

댓글 본문
작성자
비밀번호
  1. 박창신
    완료
  2. argument[0]부터 시작해서 0,1,2,3 4개입니다

    그리고 argument.length랑 매개변수갯수는 상관없는것같네요

    함수이름.length해야 4가 나오는거구요
    대화보기
    • 토니
      하나 궁금한게. 매개변수가 갯수가 4면 argument.length는 4인데
      i<argument.length는 i<4 보다 작을때인데 그럼 4는 어떻게 합하죠???
    • fastbegin
      @slowbegin

      document.write('result1 : ' + sum(1,2,3,4));
      document.write('<br/>');
      document.write('result1 : ' + sum(1,2,3,4,5,6));
      이렇게 코드 고쳐보시면 코드 잘짜셨다는걸 확인하실 수 있습니다.
    • 용돌
      0 : 1
      1 : 2
      2 : 3
      3 : 4
      result1 : 10까지 일단 출력이되고,
      엔터(<br />없이 다음번 0:1이 출력된거네요.
      대화보기
      • slowbegin
        for문을 한 번 더 사용해서
        document.write('result1 : ' + sum(1,2,3,4,5,6));
        위 코딩을 하나 더 했습니다
        그랬더니 결과값이 의도했던 것과 다르게 나옵니다...
        ①document.write('result1 : ' +sum(1,2,3,4));
        -> 0 : 1
        1 : 2
        2 : 3
        3 : 4
        result1 : 100 : 1

        ②document.write('result2 : ' +sum(1,2,3,4,5,6));
        -> 1 : 2
        2 : 3
        3 : 4
        4 : 5
        5 : 6
        result1 : 21

        ①의 result에 해당하는 값이 왜 10이 아니라 100이 나오는건가요 ㅠ
        대략 arguments.length가 1개인데
        length를 결정짓는 배열이 2개
        sum(1,2,3,4)
        sum(1,2,3,4,5,6)
        이렇게 2개라서 오류값이 나오는것 같습니다만
        정확히를 모르겠네요 ㅠ


        밑에건 제가 작성한 코딩 원본입니다
        <!DOCTYPE html>
        <html>
        <head>
        <title></title>
        </head>
        <body>
        <script type="text/javascript">
        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('result1 : ' + sum(1,2,3,4));
        document.write('result1 : ' + sum(1,2,3,4,5,6));
        </script>
        </body>
        </html>
      • Byungwook Kim
        잘 배우고 갑니다!!
      • 김경모
        자바스크립트만 저런 건가요?
      • 미완성
        20190109
      • arguments = 인자의 갯수
        length = 매개변수의 갯수
      • 스탐
        감사합니다
      • moon
        감사합니다~!
      • 정진주
        잘 듣고 갑니다~~!!
      • 안장호
        감사합니다~! ^^
      • 고순영
        정말...자유롭네요 ㅋㅋㅋㅋ 흑흑
      • 듀티프리
        좋아요. 감사합니다.
      • Seo Yun Seok Tudoistube
        감사합니다.
        다시 보니까 함수로 전달된 인자의 수를 구할 수도 있고, 실제로 함수에 전달된 인자의 수를 구할 수도 있네요.
        멋진 기능이네요^^
      • 율루
        argments 는 php의 __costruct랑 비슷하다고 보면되겠네요?
      • hsk772
        강의 다시 들으면 함수지향 이해할 수 있나요? 어흐흑.
      • 박인호
        12-15
        수강완료.
        감사합니다.
      • Jupi
        javascript는 참... 자유로운 존재군요 ㅎㅎ
        밑에 댓글을 보니, 다른 언어와 다른점과 비교할 수 있어서 좋습니다!
        댓글 짱짱!
      • 고스트프리
        이부분은 이해가네요... 다행입니다.^^
      • 으어엉
        강의 감사합니다.
        무슨 말인지는 하나도 모르겠지만요 ㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠㅠ
      • 수복
        그럼 자바스크립트 실무에서도 일부러 인자 없이 쓰나요? 그러면 정말 헷갈릴 거 같은데... 좋은 기능이긴 하나 과연 많이 사용할 지는 의문이 드는 기능이네용~
      • GoldPenguin
        완료했습니다.
      • Jeong Min Lee
        좋은 강의 감사합니다.
      • Seo Yun Seok Tudoistube
        인자가 없는 함수에 인자를 전달해도 오류없이 실행되다니... 그럼, 자바처럼 오버로드가 필요없는거 맞나요?
        함수.length 와 arguments.length 가 다를 수 있군요.
        감사합니다^_____^!!!
      • crable
        감사합니다
      • 이승우
        20170521 완료
      • 최규선
        20170501 완료! 감사합니다.
      • 신입1
        감사합니다
      • 전성욱
        (함수이름).length => 함수 내에서 정의하고있는 매개변수(파라미터)의 갯수 알려줌
        arguments.length => 함수가 호출될때 같이 전송되는 인자(아규먼트)의 갯수 알려줌

        에크마스크립트6부터 추가된 펼침 연산자(rest parameter)로 argument 객체 사용 없이 간단하게 다수의 인자값을 전달받을 수 있습니다.
        function sum(arr..){ return arr.reduce( (x,y) => x+y )};
        로 정의 후,
        sum(1,2,3,4,5)로 호출 시 15가 리턴됩니다. 함수내 파라미터 arr는 인자로 받아들인 모든 값을 배열로 저장합니다.
        function doSomething(...numlist, what)과 같이 펼침연산자 이외에도 다른 파라미터를 추가할 수 있는 등 다양한 바리에이션이 존재합니다

        마찬가지로 es6에서 추가된 스트립트 맨 앞에 "use strict";를 붙여넣는 것으로, 루즈한 자바스크립트를 조금 타이트하게 묶어줍니다
        다른 언어에서 100%예외가 발생하는 경우(ex 블록 내에서 선언된 변수를 밖에서 사용)에 예외를 발생하게 해주는 친절한 구문입니다
      • 생코짱
        항상 감사합니다
      • 임지호
        argument : 인자의 정보를 담고 있는 객체
        - 자바스크립트에서는 매개변수를 정의하지 않은 상태에서 인자의 값을 줘도 에러가 나지 않는다.
        - argument라는 변수 안에 인자의 정보를 가진 객체가 담기게 된다.
        - argument.length를 하게 되면 사용자가 입력한 인자의 수가 리턴되지만, 함수.length하게 되면 매개변수를
        몇 개나 정의했는지가 리턴된다.
      • 완료!
        완료! 감사합니다~
      • hyuna
        감사합니다~
      • yihsang
        강의 잘 듣고 있습니다.
      • 지영
        누가 자바스크립트 쉽다고 했어 ㅠ
      • egoing
        만약 <input type="text" id="f">라는 폼이 있다면
        document.getElementById('f').value를 통해서
        값을 알아 낼 수 있습니다.
        대화보기
        • 자바초보
          안녕하세요 강의 잘 보고 있습니다.
          자바스크립트 관련 궁금증이 있어 문의드립니다.
          여기에 남기는게 맞는지 모르겠습니다.

          자바스크립트에서 리턴되는 값을 폼 내부에서 받을수 있는 방법이 있을까요??
          예를들어 자바스크립트 함수에서 리턴되는 값이 1 이라 가정을 하면
          폼 내부에 id 라는 네임을 가직 인풋박스로 함수에서 리턴하는 값을 받을수 있을까요??

          도움 부탁드립니다.
          감사합니다.
        • joo0914krs
          감사합니다
        • 이주환
          2016. 04. 24

          알아두면 좋지만 쓰는경우는 거이 없었던것 같네요.
        • JustStudy
          고맙습니다
        • 국제표준규격
          이건 알아두기만 하고 사용하면 안되겠네요. 큰 프로젝트에서는 많은 버그를 양산하겠어요.
        • Byeong Koo Kang
          c나 java에서 main argument는 있었지만, 함수마다의 argument 갯수를 세는건 못 본거 같은데.. 아닌가요??

          javascript는 정말.. 많은걸 해볼 수 있네요..
        • egoing
          sum은 함수고 _sum은 변수입니다.
          대화보기
          • Cho Jeaho
            sum과 _sum을 나눈것은 지역변수와 전역변수의 구별을 위해서 나눈것인가요?
          • 김경민
            다른 언어를하다가 자바스크립트하니까 좀 해깔리긴하네요 ㅋㅋ 자바스크립트는 너무 관대한것같아요
          • 고고
            ㅋㅋㅋㅋ 파라미터를 받도록 코딩을 안했는데 파라미터를 받을 수 있다니 ㄷㄷㄷ 혼란스럽다 ㅋㅋㅋ
          • 게임
            강의 잘 보았습니다. 짧은 시간에 압축적으로 잘 설명해 주시네요..
          버전 관리
          egoing
          현재 버전
          선택 버전
          graphittie 자세히 보기