자바스크립트 ... 이용하기

javascript에서 ...은 spread operator로 배열을 풀어주는 역할을 합니다.

이를 활용하면 배열을 복사하는 용도로도 이용할 수 있습니다.

const people = [
    {name: 'Kim', age: 10},
    {name: 'Lee', age: 20},
    {name: 'Park', age: 30},
]
 
const copied = [...people, {name: 'Alex', age: 40}]

위처럼 하면 copied 배열에는 people 배열에 있는 3개의 object + 새로운 object (Alex) 이렇게 4개가 생깁니다.

** 위 예제에서 copied와 people 배열은 같은 object를 가리키고 있기 때문에 Kim, Lee, Park의 object를 copied에서 변경하면 people에도 영향이 갑니다.

 

...은 object에서도 사용 가능합니다.

const person = {name: 'kim', cnt: 1}
const copied = {...person, cnt: 0}

위처럼 하면 copied에는 person이 그대로 복사됩니다. 그런데 cnt: 0을 추가로 주었습니다.
이러면 cnt값은 0으로 변경되어서 copied는 {name: 'kim', cnt: 0} 이렇게 됩니다.

** 이 경우에는 person과 copied는 서로 다른 object입니다. 즉, 서로 영향을 끼치지 못합니다.