자바스크립트/JavaScript

[JS] 매개변수 예제

KIMJAVAN 2024. 8. 14. 10:08
728x90
function add(a, b) {
  console.log('1.', arguments);
  console.log('2.', arguments[0]);
  console.log('3.', typeof arguments);
  return a + b;
}

console.log('4.', add(1, 3, 5, 7));

 

이 코드에서 add 함수는 매개변수 a와 b를 받아 두 값을 더하는 단순한 함수입니다. 그런데 이 함수는 arguments 객체를 통해 전달된 모든 인자를 확인하고 있습니다.

  • arguments 객체는 함수가 호출될 때 전달된 모든 인자를 배열 형태로 담고 있습니다. (하지만 실제 배열은 아니며 배열처럼 동작하는 유사 배열 객체입니다.)

코드 실행 순서:

  1. add(1, 3, 5, 7) 함수가 호출됩니다.
    • a = 1, b = 3으로 할당되고, 나머지 5, 7은 arguments 객체에 저장됩니다.
  2. console.log('1.', arguments);
    • 함수 내에서 arguments 객체를 출력합니다.
    • 이 경우 1. [1, 3, 5, 7]이 출력됩니다.
  3. console.log('2.', arguments[0]);
    • arguments[0]은 첫 번째 인자인 1을 출력합니다.
    • 이 경우 2. 1이 출력됩니다.
  4. console.log('3.', typeof arguments);
    • arguments의 타입은 'object'이므로 3. object가 출력됩니다.
  5. return a + b;
    • a + b를 계산합니다. 1 + 3 = 4가 됩니다.
  6. console.log('4.', add(1, 3, 5, 7));
    • add(1, 3, 5, 7) 함수의 반환 값인 4를 출력합니다.
    • 이 경우 '4.'과 함수 반환 값 4이 함께 출력됩니다.
    • 4. 4가 출력됩니다.

출력이 이렇게 되는 이유

console.log('4.', add(1, 3, 5, 7)); 라인에서 먼저 add 함수가 호출되어 console.log들이 순차적으로 실행된 후, a + b의 결과인 4가 반환됩니다. 그리고 이 반환된 값 4가 console.log('4.', 4);로 출력되는 것입니다.

따라서 출력은 다음과 같은 순서로 이루어집니다

 

1. [1, 3, 5, 7]
2. 1
3. object
4. 4

 

즉, 4. 4는 console.log('4.', add(1, 3, 5, 7)); 라인의 4.와 add 함수가 반환한 4가 같이 출력된 것입니다.