Javascript oop 얕은복사와 깊은복사

poburi FE·2020년 9월 13일
0

js

목록 보기
6/8

참조와 복사

참조는 참조한 객체의 데이터를 바꾸면, 원본의 데이터가 영향을 받는다

복사는 원본데이터에 영향을 받지 않는다.

참조

자바스크립트에서 객체는 참조다.
즉, 참조한 데이터의 값을 바꾸게 되면 원본의 데이터에 영향을 받는다.

객체의 종류로는 객체, 배열, 함수가 있다.
따라서 객체, 배열, 함수의 데이터를 복사하려면 특별한 방법이 필요하다.

복사

원시값은 특별한 방법으로 복사해도 원본 데이터에 영향을 받지 않는다.

원시값의 종류로는 불린, 문자열, 숫자가 있다.
원시값은 자동으로 복사가 된다.

let a = 1;
let b = a;

b = 2;

console.log(a); // 1
console.log(b); // 2

하지만, 객체는 원시값이 아니므로 위의 방법대로 하면 원본데이터도 바뀐다고했다. 객체를 참조가 아닌 복사를 하고 싶다면?

1️⃣ JSON 메서드를 이용한 깊은 복사:

JSON.parse(JSON.stringify(obj));

성능적으로 안좋아서 안쓰는게 좋다.

2️⃣ arr.slice()
3️⃣ 1단계만 복사, 나머지는 참조:

Object.keys(obj).forEach(function(key){
   obj2[key] = obj[key];
})

4️⃣ 2단계까지 복사

function copyObj(obj){
	var copy = {};
    if(typeof obj === 'object' && obj !== null){
       for (var attr in obj) {
       		if(obj.hasOwnProperty(attr)) {
            	copy[attr] = copyObj(obj[attr]);
            }
       }
    } else {
    	copy = obj;
    }
    return copy;
}
profile
FE 개발자 poburi

0개의 댓글