스프레드 문법

1. 스프레드 문법 ... 은하나로 뭉쳐 있는 여러 값들의 집합을 펼쳐서 개별적인 값들의 목록으로 만든다. for...of문으로 순회할 수 있는 이터러블에 한정하여 사용할 수 있다. 스프레드 문법의 결과는 값이 아닌 값들의 목록이므로 변수에 할당할 수 없다.

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

console.log('Hello'); // H e l l o

2. 함수의 인수 목록으로 배열이 아닌 목록을 전달해야 하는 경우 효과적이다.

const arr = [1,2,3];

 // 스프레드 문법을 사용하여 배열 arr를 1,2,3으로 펼쳐서 전달한다.
const max = Math.max(...arr); // -> 3

3. 스프레드 문법은 Rest 파라미터와 형태가 동일하여 혼동할 수 있으나 Rest 파라미터의 경우 함수에 전달된 인수들의 목록을 배열로 전달받기 위해 사용하는 문법이므로 스프레드 문법과 정 반대의 개념이다.

function foo (...rest){
  console.log(rest); // 1,2,3 -> [1,2,3]
}

// 스프레드 문법은 배열과 같은 이터러블을 펼쳐서 개별적인 값들의 목록을 만든다.
foo(...[1,2,3]); // 1,2,3

4. 스프레드 문법을 사용하면 별도의 메서드를 사용하지 않고 2개의 배열을 1개의 배열로 결합할 수 있다.

const arr = [...[1,2],...[3,4]];
console.log(arr); // [1,2,3,4]

5. 어떤 배열 중간에 다른 배열의 요소들을 추가할때 유용하게 사용할 수 있다.

const arr1 = [1,4];
const arr2 = [2,3];

arr1.splice(1,0,...arr2);
console.log(arr1); // [1,2,3,4]