써치킴의 우당탕탕 개발 블로그

[JS Level up][Ch1][데이터] 얕은 복사와 깊은 복사 본문

파도파도 나오는 JavaScript

[JS Level up][Ch1][데이터] 얕은 복사와 깊은 복사

써치킴 2022. 1. 31. 02:05

얕은 복사(Shallow copy)

// 얕은 복사
const user = {
  name : 'Searchkim',
  age : 29,
  email : 'ejkim.Dev@gmail.com'
};

const copyUser = user;    // copyUser와 user는 같은 메모리 주소를 바라봄
console.log(copyUser === user);   // true

const asUser = Object.assign({}, user);   // user를 {}에 복사해서 넣음 -> 새로운 메모리 할당
console.log(asUser === user);     // false

const deUser = {...user};    // 전개 연산자 -> 새로운 메모리 할당
console.log(asUser === user);     // false

user.age = 22;
console.log('user', user);
console.log('copyUser', copyUser);
console.log('asUser', asUser);
console.log('deUser', deUser);

깊은 복사(Deep copy)

lodash 패키지 설치

npm i lodash
import _ from 'lodash'

const user = {
  name : 'Searchkim',
  age : 29,
  email : 'ejkim.Dev@gmail.com'
};

const copyUser = _.cloneDeep(user);   // 깊은 복사

user.age = 22;
console.log('user', user);
console.log('copyUser', copyUser);

Comments