[모던 자바스크립트 딥다이브] 35장 스프레드 문법

 

 

스프레드 문법

• ... 하나로 뭉쳐 있는 여러 값ㄷ르의 집합을 펼쳐서 개별적인 값들의 목록으로 만듬
• Rest 파라미터와 형태가 동일하지만 전혀 다른 개념임!
• 스프레드 문법 대상은 for ... of 문으로 순회할 수 있는 이터러블에 한정됨
• 스프레드 문법의 결과물 (값으로 사용 불가)
  
  • 함수 호출문의 인수 목록
  • 배열 리터럴의 요소 목록
  • 객체 리터럴의 프로퍼티 목록

 

 

함수 호출문의 인수 목록으로 사용

• 배열을 함수의 인수 목록으로 전달할 때 사용함

const arr = [1,2,3];

const max = Math.max(...arr); // 3

 

 

 

배열 리터럴 내부에서 사용

• concat : 2개의 배열 합치기

// ES5
var arr = [1,2].concat([3,4]);

// ES6
const arr = [...[1,2], ...[3.4]];

• splice : 배열 중간에 다른 요소 추가나 삭제

// ES5
var arr1 = [1,4];
var arr2 = [2,3];

Array.prototype.slice.apply(arr1, [1,0].concat(arr2));

// ES6
const arr1 = [1,4];
const arr2 = [2,3];
arr1.splice(1,0,...arr2);

• 배열 복사

// ES5
var origin = [1,2];
var copy = origin.skice();

// ES6
const origin = [1,2];
const copy = [...origin];

• 이터러블을 배열로 복사

 

 

객체 리터럴 내부에서 사용

• 일반 객체를 대상으로도 스프레드 문법의 사용 허용함
• Object.assign 메서드를 대체할 수 있음