데이터 - 얕은 복사와 깊은 복사
1. 얕은 복사(Shallow copy)
Obejct.assign() 메소드나 전개 연산자(...)를 사용한 복사
const user = {
name: 'Orosy',
age: 33,
emails: ['hanei100@naver.com]
}
const copyUser = user
console.log(copyUser === user)
user.age = 22
console.log(user)
console.log(copyUser)
const shallowUser = Object.assign({}, user)
console.log(shallowUser === user)
console.log(shallowUser)
const spreadUser = {...user}
console.log(spreadUser === user)
console.log(spreadUser)
user.emails.push('hanei7632@gmail.com')
console.log(user.emails === spreadUser.emails)
2. 깊은 복사(Deep copy)
JavaScript로 직접적으로 구현하기엔 복잡함
따라서, Lodash 패키지를 이용하여 깊은 복사 구현
import _ from 'lodash'
const user = {
name: 'Orosy',
age: 33,
emails: ['hanei100@naver.com]
}
const copyUser = _.cloneDeep(user)
console.log(copyUser === user)
user.age = 22
console.log(user)
console.log(copyUser)
user.emails.push('hanei7632@gmail.com')
console.log(user.emails === copyUser.emails)
console.log(user)
console.log(copyUser)
깊은 복사는 재귀(반복 실행)하며 복사를 처리!
결국, 객체나 배열 데이터를 간단히 복사할 때에는 얕은 복사를 사용하되 참조형 데이터 내에 또 다른 참조형 데이터가 포함되어 있을 때에는 깊은 복사를 이용해야 한다