[JavaScript] Spread Operator가 모임? 어따씀??(Deep Copy 깊은복사 + 배열 object 덮어쓸때씀😮) (2)

 

 

https://gallery-k.tistory.com/360

 

Spread Operator 어따씀?

 

 

Spread Operator 는 참조타입 칭구들(배열이랑 object) 깊은 복사를 할 때 씁니다.

 

1. 배열 합치기

2. object 합치기

 

+ 값 중복되면 덮어씌워짐

 

 

---

 

1. 배열 합치기

let 배열1 = [1,2,3];
let 배열2 = [4,5];

여기 두 배열이 있눈데여

두 가지 방법으로 깊은 복사를 해보겠습니다.

 

let 배열3 = [...배열1];     // == 배열1 deep copy
let 배열4 = [...배열1,...배열2]; // == 배열1 + 배열2 deep copy

console.log("배열3: ", 배열3);
console.log("배열4: ",배열4);

array.push() 와 같은 느낌으로 사용하는 겁니다.

 

 

 

 

---

2. object 합치기

 

object 도 배열과 똑같습니당

let o1 = {
    a:1,
    b:2
};

let o2 = {
    c:3
};

여기 두 오브젝트가 있는데여

마찬가지로 Spread Operator 로 깊은복사를 해보겠습니다.

 

 

이렇게 오브젝트 안에다가 깊은 복사를 넣을 수도 있구여

let o3 = {
    ...o1,
    c:3
};


console.log("o3: ",o3);

 

 

 

이렇게 그냥 object 자체를 깊은 복사 할 수도 있습니다.

let o4 = {...o1};

console.log("o4: ",o4);

 

 

 

---

 

 

+ 값 중복되면 덮어씌워짐

값이 중복되면 덮어씌워짐니다.😍😍

이게 진짜 좋은데여

저는 실무할때 값 덮어씌워지는거 때문에 이거 쓰거든요

 

유저가 자신의 정보를 입력하고 수정 눌렀을 때

기존에 있던 정보에 덮어씌워지면서 object 형태로 넘어갑니다. (개꿀)

 

 

let obj1 = {
    a:1,
    b:2
};

let obj2 = {
    ...obj1,
    a:2
};

console.log("obj2: ",obj2);

 

키값 a 의  값이 1 에서 2 로 바뀐걸 확인할 수 있습니다.