[JavaScript] 함수의 인자(parameters)에 대하여

함수의 매개변수에 아무것도 전달하지 않으면 어떻게 될까?

a와 b를 매개변수로 받아 두 매개변수의 곱을 반환해주는 multiply 함수가 있다고 가정하자.

만약 아래 코드처럼 multiply 함수를 호출했는데 매개변수를 전달해주지 않는다면 인자는 어떤 타입을 가지게 될까?

 

function multiply(a, b){
  return a * b;
};

multiply();

 

매개변수들이 전달되지 않은 경우, console에 각 매개변수들이 어떻게 받아와지는지 확인해보자.

function multiply(a, b){
  console.log(a); // undefined
  console.log(b); // undefined
  return a * b;
};

multiply();

위의 코드처럼 매개변수가 전달되지 않은 경우, undefined로 출력됨을 알 수 있다.

 

 

 

console.log(multiply()); // NaN

위의 코드처럼 함수의 return 값의 경우 NaN로 출력된다.

 

---

 

함수의 매개변수들을 함수 내부에서 접근할 수 있는 arguments 객체가 존재한다

function multiply(a, b){
  console.log(a); // undefined
  console.log(b); // undefined
  console.log(arguments);
  return a * b;
};

multiply(2, 4, 6);

위의 코드처럼 multiply 함수에 2,4,6을 매개변수로 전달했다고 하면,

(multiply 함수에서는 매개 변수가 2개만 필요하므로 6은 무시된다.)

 

multiply 함수 안에서는 arguments 객체에 다음과 같이 저장된다.

[Arguments] { '0': 2, '1': 4, '2': 6 }

따라서 arguments[0], arguments[1] 등 key 값을 활용해 전달된 매개변수에 접근할 수 있다.

 

 

---

Rest 매개변수(Rest Parameters)

만약 함수에 몇 개의 매개 변수가 전달될지 모른다면, Rest 매개변수를 사용할 수 있다.

Rest 매개변수는 ...매개변수명 의 형식으로 사용할 수 있다.

function printMenu(...menus){
  console.log(menus); // [ '🍕', '🍟', '🍔', '🍝' ]
}

printMenu('🍕', '🍟', '🍔', '🍝');

예시로 음식 메뉴를 출력해주는 printMenu 함수가 있다고 했을 때,

몇 개의 menu가 전달될 지는 모르기 때문에 ...menus 라고 매개변수를 설정해놓은 후에,

함수를 호출할 때 매개변수들을 전달해주면 된다.

 

Rest 매개 변수를 사용한 함수의 반환 값은 배열 형태로 반환된다.

[ '🍕', '🍟', '🍔', '🍝' ]

 

 

 

function print(pizza, fries, ...menus){
  console.log(pizza); //🍕
  console.log(fries); //🍟
  console.log(menus); // [ '🍔', '🍝' ]
}

print('🍕', '🍟', '🍔', '🍝');

위의 코드처럼 특정 매개변수를 설정하고, Rest 매개변수를  함께 사용할 수도 있다.