Deep Copy, Shallow Copy

지금 까지 여러 강의를 수강하면서 잘 이해가 되지 않았는데 이번에는 이해가 되어서 글 작성을 해보려고 합니다.

 

const obj = {
    property1: "1",
    property2: {
        subProperty1: '2-1',
        subProperty2: '2-2',
    }
}

 

먼저 위와 같이 obj를 생성해 줬습니다. 

 

const obj2 = Object.assign({}, obj); //shallow copy(얕은 복사)

다음으로 obj2를 생성하고 Object.assign() 함수를 사용해 {} 빈 객체에 obj를 복사하였습니다. 이것이 바로 shallow copy를 의미합니다. 

 

얕은 복사를 했을 경우 obj2의 property1의 값을 변경했을 경우 obj1의 값과는 무관합니다. 하지만 obj2 객체에 있는 subProperty1이나 subProperty2의 value값을 변경하게 되면 obj도 바뀌게 될 것입니다. 왜냐하면 obj안에 있는 오브젝트의 값을 복사한 것이 아니라 주소를 복사했기 때문입니다.

 

그렇다면 obj를 완전히 복사하려면 어떻게 해야할까요? 맞습니다 DeepCopy를 하시면 됩니다.

 

const deepCopy = (origin) => {
    const result = {};

    for (let i in origin) {
        if (origin[i] != null && typeof origin[i] === "object") {
            result[i] = deepCopy(origin[i]);
        } else {
            result[i] = origin[i];
        }
    }

    return result;
};

deepCopy 함수를 선언해주시고 매개변수로 origin 값을 받습니다. 다음으로 결과 값이 담길 객체 result를 생성해 주시고 반복문을 통해서 매개변수로 받은 origin의 키값 i가 null값이 아니거나 object의 형태를 갖는다면 다시 하면 deepCopy함수를 통해서 반복할 것입니다. origin의 값이 object가 아니라면 값을 result에 저장할 것입니다.

 

이렇게 되면 완전한 DeepCopy를 할 수 있습니다.