가라멜의 달달한 세상 탐방

출처 : https://poiemaweb.com/es6-extended-parameter-handling

Extended Parameter Handling | PoiemaWeb

이 포스팅의 위 출처의 게시글을 공부하며 필기 하듯이 써놓은 내용이므로,

정확한 내용은 위의 출처에서 보는 것이 좋다.

 

1. 파라미터 기본값

ES5에서는 파라미터에 기본값을 설정할 수 없었다. 따라서 적절한 인수가 전달되었는지 함수 내부에서 확인할 필요가 있었다. 

반면 ES6엣는 파라미터에 기본값을 설정하여 함수 내에서 수행하더 파라미터 체크 및 초기화를 간소화 할 수 있다.

 

2. Rest 파라미터

2.1 기본문법

Rest 파라미터는 Spread 연산자(...)를 사용하여 파라미터를 정의한 것을 의미한다.

Rest 파라미터를 사용하면 인수의 리스트를 함수 내부에서 배열로 전달받을 수 있다. 

function foo( .. rest) {
	console.log(Array.isArray(rest)); // true
    console.log(rest); // [1,2,3,4,5]
  }
  
  foo(1,2,3,4,5);

인수는 순차적으로 파라미터와 Rest 파라미터에 할당된다.

Rest 파라미터는 반드시 마지막 파라미터이어야 한다.

 

2.2 arguments와 rest 파라미터

ES5에서는 인자의 개수를 사전에 알 수 없는 가변 인자 함수의 겨우, arguments 객체를 통해 인수를 확인한다. arguments 객체는 함수 호출 시 전달된 인수들의 정보를 담고 이는 순회가능한 유사 배열 객체이며 함수 내부에서 지역 변수처럼 사용할 수 있다.

ES6에서는 rest 파라미터를 사용하여 가변 인자를 함수 내부에 배열로 전달할 수 있다. 이렇게 하면 유사 배열인 arguments 객체를 배열로 변환하는 등의 번거로움을 피할 수 있다.

function sum(... args){
	console.log(arguments);
    console.log(Array.isArray(args));
    return args.reduce((pre, cur) => pre + cur);
  }
  console.log(sum(1,2,3,4,5));

하지만 ES6의 화살표 함수에는 함수 객체의 arguments 프로퍼티가 없다. 따라서 화살표 함수로 가변 인자 함수를 구현해야 할 때는 반드시 rest 파라미터를 사용해야 한다.

 

3. Spread 연산자

Spread 연산자는 피연산자를 개별 요소로 분리한다. Spread 연산자의 피연산자는 이터러블이어야 한다.

// ...[1, 2, 3]는 [1, 2, 3]을 개별 요소로 분리한다(→ 1, 2, 3)
console.log(...[1, 2, 3]) // 1, 2, 3

// 문자열은 이터러블이다.
console.log(...'Hello');  // H e l l o

// Map과 Set은 이터러블이다.
console.log(...new Map([['a', '1'], ['b', '2']]));  // [ 'a', '1' ] [ 'b', '2' ]
console.log(...new Set([1, 2, 3]));  // 1 2 3

// 이터러블이 아닌 일반 객체는 Spread 연산자의 피연산자가 될 수 없다.
console.log(...{ a: 1, b: 2 });
// TypeError: Found non-callable @@iterator

3.1 함수의 인수로 사용하는 겨우

배열을 분해하여 배열의 각 요소를 파라미터에 전달하고 싶은 겨우, Function.prototype.apply를 사용하는 것이 일반적이다.

3.2 배열에서 사용하는 경우

3.2.1 concat

ES5에서기존 배열의 요소를 새로운 배열 요소의 일부로 만들고 싶은 경우, 배열 리터럴 만으로 해결할 수 없고 concat  메소드를 사용해야 한다.

ES6에서는 Spread 연산자를사용하여 배열 리터럴 만으로 기존 배열의 요소를 새로운 배열 요소의 일부로 만들 수 있다.

3.2.2 push

3.2.3 splice

3.2.4 copy 

 

4. Rest/Spread 프로퍼티