[JS ES6+] spread 연산자

 

spread 연산자라고하는 ES6 문법이다.

array나 object 자료형에 사용할 수 있으며 의미는 중괄호나 대괄호를 벗겨주세요~ 라는 뜻이다. 

다시말해 …[1,2,3] 이런식으로 쓰면 그 자리에 1,2,3 이 남는다. 괄호 벗기기용 연산자이다.

 

그런데 이걸 이용하는 두번째 용도도 있는데 array나 object 자료형을 shallow/deep copy할 때 많이 사용한다.

 

React state를 수정할 때 많이 쓰인다. deep copy를 해야지만 원본 상태에 영향을 전혀 미치지않기 때문이다.

let data1 = [1,2,3];
let data2 = ...data1; // 1,2,3
let data3 = [...data1]; // [1,2,3]

 

data1에 있던 자료들을 괄호 벗긴 다음에 다시 array로 만들어주세요~ 라는 뜻인데 array를 이런 식으로 사용하면

완전 독립적인 array 복사본을 생성해주는 copy가 가능하다. object 자료형 또한 똑같이 가능하다.