TIL31: Parameters and Spread Operator

• 함수의 Parameter 즉, 전달인자의 갯수가 유동적일 경우 ES5에서는
  arguments 라는 키워드를 활용했습니다.

function getMaxNum() {
  console.log(arguments);
}
getMaxNum(3, 5, 8, 10); // {0: 3, 1: 5, 2: 8, 3: 10}

{0: 3, 1: 5, 2: 8, 3: 10} 즉 arguments 객체는 유사배열(Pseudo Array, Array-like Object)로써 배열 메소드는 사용할 수 없습니다.

arguments[0]; // 3  arguments['0']과 일치
arguments[1]; // 5  arguments['1']
arguments[2]; // 8  arguments['2']
arguments[3]; // 10 arguments['3']

• 한편 ES6에서는 Rest Parameter를 이용해 매개변수를 지정해 줍니다. 이 때 사용하는 것이 Spread Operator 입니다.

function getMaxNum(...nums) {
  console.log(nums);
}
getMaxNum(3, 5, 8, 10); // [3, 5, 8, 10]

...nums 에서 nums 는 명백히 순서가 존재하는 배열입니다. 즉 유동적인 전달인자 모두를 순서대로 가지는 배열로써 매개변수를 표현한 것입니다.

• 또한 ES6에서는 전달인자가 특별하게 정해지지 않을 경우 매개변수의 기본값을 할당하고 싶을 때 활용하는 것이 Default Parameter입니다.

function getRoute(departure='ICN', destination) {
  return 'departure: '+departure+', destination: '+destination;
}
getRoute(undefined, 'PEK'); // departure: ICN, destination: PEK

2개 이상의 매개변수들에 대해서는 그 순서가 중요하므로 만약 중간에 배치된 매개변수의 default 값을 적용하기 위해서는 반드시 전달인자가 없음(undefined)을 표시해야 제대로 작동됩니다.

코드 및 자료 출처: 코드스테이츠(CodeStates)