심볼(Symbol)
= 변경이 불가한 데이터로, 유일한 식별자를 만들어 데이터를 보호하는 용도로 사용할 수 있습니다.
Symbol('설명')
= '설명'은 단순 디버깅을 위한 용도일 뿐, 심볼 값과는 관계가 없습니다.
const sKey = Symbol('Heool!')
const user = {
key: '일반 정보!',
[sKey]: '민감한 정보!'
}
console.log(user.key) // 일반 정보!
console.log(user['key']) // 일반 정보!
console.log(user[sKey]) // 민감한 정보!
console.log(user[Symol('Hello!')]) // unbdefined
console.log(sKey) // Symbol(Hello!)
불변성 & 가변성
= 불변성(Immutability)은 생성된 데이터가 메모리에서 변경되지 않고,
= 가변성(Mutability)은 생성된 데이터가 메모리에서 변경될 수 있음을 의미합니다.
자바스크립트는 원시형은 불변성을, 참조형은 가변성을 가지고 있습니다.
ex)
let a = 1
let b = a
b = 2
console.log(b) // 2
console.log(a) // 1
ex2)
let a = { x: 1}
let b = a
b.x = 2
console.log(b) // {x:2}
console.log(a) // {x:2}
얕은 복사 & 깊은 복사
= 참조형은 가변성으로 인해, 데이터를 복사할 때 주의가 필요합니다.
= 얕은 복사(Shallow Copy) - 참조형의 1차원 데이터만 복사
= 깊은 복사(Deep Copy) - 참조형의 모든 차원 데이터를 복사
ex)
let a = { x: 1}
let b = Object.assign({}, a) // ( assign 메소드를 이용한 얕은 복사 )
let c = { ...a } // ( 전개연산자를 이용한 얕은 복사 )
let d = [1,2,3]
let f = d.concat([]) // 배열에서의 얕은복사
b.x = 2
console.log(b)
console.log(a)
ex2)
const a2 = { x: { y: 1} }
const b2 = { ...a2 }
b2.x.y = 2
// 얕은 복사를 사용하면 2차원의 데이터는 가변하기 때문에 완벽하게 분리하기 위해서는 깊은 복사가 필요하다.
console.log(b2)
console.log(a2)
ex3)
import cloneDeep from './lodash/cloneDeep';
const a = { x: { y: 1 } };
const b = cloneDeep(a);
b.x.y = 2;
console.log(b); // { x: { y: 2 } }
console.log(a); // { x: { y: 1 } }
