ES6부터 도입된 스프레드 문법(spread syntax)인 ... 는 하나로 뭉쳐 있는 여러 값들의 집합을 펼쳐서 개별적인 값들의 목록으로 만든다.
이게 먼소리여…
console.log(...[1,2,3]);
console.log(...'Hello');
//Map과 Set은 이터러블이다.
console.log(... new Map([['a','1'],['b','2']]));
console.log(... new Set([1, 2, 3]));
//이터러블이 아닌 일반 객체는 스프레드 문법을 사용할 수 없다
// console.log(...{a: 1, b: 2});
보니까
...는 이터러블인 친구들을 다 요소별로 분해해서 for문을 돌려주는 문법인 듯 하다. 이때 이터러블인 객체 앞에...를 붙인다....이 평가된 값은 해당 이터러블 객체에 for문 돌면서 하나씩 요소들이 평가되어 나오는 듯 함.
...[1,2,3] 은 이터러블인 배열을, 개별적인 값의 목록 1 2 3으로 만든다. 이 1 2 3 은 값이 아니라 값들의 목록이다.
⚠️ 즉 스프레드 문법의 결과는 값이 아니다.
이는 스프레드 문법인 ... 이 피연산자를 연산해 값을 생성하는 연산자가 아님을 의미한다.
따라서 스프레드 문법의 결과는 변수에 할당할 수 없다.
그럼 언제 스프레드 문법을 어디에서 사용하는가? 다음과 같이 쉼표로 구분한 값의 목록을 요구하는 문맥에서 사용할 수 있다.