[함수] - 매개변수와 인수

• 매개변수(parameter)
  • 함수의 정의에서 전달받은 인수를 함수 내부로 전달하기 위해 사용하는 변수를 의미 
  • 함수 정의할 때 매개변수의 타입을 따로 명시하지 않는다.
  • 함수 호출 시 인수(argument)로 전달된 값에 대해 어떠한 타입 검사도 하지 않는다.
    • 인수란, 함수가 호출될 때 함수로 값을 전달해주는 값
  • 함수 호출 시 적은 수의 인수가 전달되더라도 오류를 발생시키지 않는다.
    • NaN 반환 (계산 할 수 없다)
  • 전달되지 않은 나머지 매개변수에 자동으로 undefined값을 설정한다.
    • 산술 연산 수행을 하지 못한다.

  • function addNum(x, y, z) {  // x, y, z라는 3개의 매개변수를 가지는 함수 addNum() 정의
        return x + y + z;
    }
    
    addNum(1, 2, 3);  // 인수로 1, 2, 3을 전달해 함수를 호출 => 6
    addNum(1, 2) // 인수로 1, 2를 전달해 함수를 호출 => NaN
    addNum(1)  // 인수로 1을 전달해 함수를 호출 => NaN
    addNum();  // 인수로 아무것도 전달하지 않고 함수를 호출 => NaN

  • NaN을 반환하지 않고 전달된 인수만 가지고 계산 가능한 함수 작성
    

    function addNum(x, y, z) {
        if(x === undefined)  // 함수 호출 시 x에 해당하는 인수가 전달되지 않은 경우
            x = 0;   // 변수 x의 값을 undefined에서 0으로 변경
        if(y === undefined) // 함수 호출 시 y에 해당하는 인수가 전달되지 않은 경우
            y = 0;
        if(z === undefined) // 함수 호출 시 z에 해당하는 인수가 전달되지 않은 경우
            z = 0;
        return x + y + z;
    }
    
    addNum(1, 2, 3); // 6
    addNum(1, 2);  // 3
    addNum(1);  // 1
    addNum();  // 0

• arguments 객체
  • 함수의 정의보다 많은 수의 인수가 전달되면, 매개변수에 대입되지 못한 인수들은 참조할 수 없기 때문에
    arguments객체 이용한다.
  • 함수로 전달된 인수의 총 개수를 확인하거나
  • 각각의 인수에도 바로 접근할 수 있다.
  • 함수가 호출될 때 전달된 인수를 배열의 형태로 저장하고 있다.
  • 인수의 총 개수는 arguments객체의 length프로퍼티에 저장된다.
  • 배열과 비슷할 뿐, 실제로 Array객체는 아니다.

  • function addNum() {
        var sum = 0;
        for(var i = 0; i < arguments.length; i++) {  // 전달받은 인수의 총 수만큼 반복
            sum += arguments[i];
        }
        return sum;
    }
    
    addNum(1, 2, 3);  // 6
    addNum(1, 2);  // 3
    addNum(1);  // 1
    addNum();  // 0
    addNum(1, 2, 3, 4, 5, 6, 7, 8, 9, 10);  // 55

• 디폴트 매개변수 (default parameter)  ---> ECMAScript6부터 새롭게 정의된 매개변수
  • 함수를 호출할 때 명시된 인수를 전달하지 않았을 경우에 사용하게 될 기본값(undefined)
  • 익스플로러, 사파리, 오페라에서 지원하지 않는다.

  • function mul(a, b) {
        // 인수가 한 개만 전달되었을 때 나머지 매개변수의 값을 undefined값이 아닌 1로 설정함
        b = (typeof b !== 'undefined') ? b : 1;
        return a * b;
    }
    
    mul(3, 4);  // 12
    mul(3);  //3

  • // 기본값 변경 가능
    
    function mul(a, b = 1) { // 인수가 한 개만 전달되면 나머지 매개변수의 값을 언제나 1로 설정해 줌
        return a * b;
    }
    
    mul(3, 4);  // 12
    mul(3);  // 3

• 나머지 매개변수 (rest parameter)  ---> ECMAScript6부터 새롭게 정의된 매개변수
  • 익스플로러, 사파리에서 지원하지 않는다.
  • 나머지 매개변수는 생략 접두사(...)사용
    • 특정 위치의 인수부터 마지막 인수까지 한 번에 지정

  • function sub() {
        var firstNum = arguments[0];  // 첫 번째 인수에서
         
         for (var i = 0; i < arguments.length-1; i++) { // 두번째부터 마지막 인수까지를
             firstNum -= arguments[i+1];  // 뺌
         }
         
         return firstNum;
    }
    
    sum(10, 2, 3);  // 10 - 2 - 3 = 5
    sum(10, 1, 5, 8);  // 10 - 1 - 5 - 8 = -4

  • // 첫 번째 인수를 변수 firstNum에 저장하고 나머지 인수들을 배열 restArgs에 저장함
    
    function sub(firstNum, ...restArgs) {
        for(var i = 0; i < restArgs.length; i++) {
            firstNum -= restArgs[i];
        }
        
        return firstNum;
    }
    
    sub(10, 2, 3);  // 10 - 2 - 3 = 5
    sub(10, 1, 5, 8); // 10 - 1 - 5 - 8 = -4