js 데이터 알아보기 / 얕은복사(Sallow copy), 깊은복사(Deep copy)

얕은복사(Sallow copy)

const user = {
    name: 'kjun',
    age: '93',
    emails: ['kjun_all@naver.com']
}

const copyUser = user;
console.log(copyUser === user); // true
// 복사한 데이터가 같이 변형이 된다.

const copyUser = Object.assign({}, user);
console.log(copyUser === user); // false
// 대상객체에다가 출처객체의 속성들을 통해서 얕은복사가 가능하다.
// 새로운 데이터로 사용할 수 있다.

const copyUser = {...user};
console.log(copyUser === user); // false
// ... 전개연산자로도 얕은 복사가 가능하다.
// 새로운 데이터로 사용할 수 있다.

- 또 다른 참조데이터가 없다면 얕은복사로 가능.

- 의도치않게 원본데이터가 같이 수정될 수 있음.

 

깊은복사(Deep copy)

const copyUser = _.cloneDeep(user);
console.log(copyUser === user); // false


user. emails.push('codenote@gmail.com');

console.log(user.emails === copyUser.emails);
// user – {name: "kjun", age: 22, emails: ["kjun_all@naver.com", "codenote@gmail.com"]}
console.log('user', user);
// copyUser – {name: "kjun", age: "93", emails: ["kjun_all@naver.com"]}

console.log('copyUser', copyUser); // false

- lodash.cloneDeep 기능으로 쉽게 사용할 수 있다.

- 또 다른 참조데이터가 있으면 깊은복사를 사용.

 

 

Lodash Documentation