JS | Object : assign(), freeze()

변경불가성(immutablity)은 객체를 생성하고 난 후 변경이 불가능하도록 만드는 것을 의미한다.

객체는 참조(reference)형태로 전달하고 전달받으며 원시 타입과 달리 변경 가능한 값이다. 객체의 참조 값을 공유하는 형태이기 때문에 객체의 값을 변경했을 때 참조하고 있는 다른 모든 장소에서 변경이 일어나게 된다.
이 때 의도치 않은 변경을 방지하기 위한 것이 불변 데이터 패턴이다. 객체 자체를 불변 객체로 만들거나, 객체의 변경이 필요할 경우 복사본을 만들어 값을 변경한다.

1. 객체의 방어적 복사 (defensive copy)
   Object.assign
2. 불변 객체화
   Object.freeze

---

1. 불변 객체화

Object.freeze(obj)

.freeze()는 객체를 변경할 수 없게 동결한다. 동결된 객체는 프로퍼티의 값을 변경할 수도, 프로퍼티를 새롭게 추가, 삭제할 수도 없다. 하지만 deep freeze하지 않기 때문에 객체 안의 객체(Nested Object)는 변경 가능하다.
매개변수로 동결할 객체를 받으며 함수에 전달한 객체를 그대로 반환한다.
동결 후 변경을 시도하면 조용히 무시되지만 엄격 모드에서는 타입 에러가 발생한다.

const user1 = {
  name: 'lee',
  address: {
    city: "seoul"
  }
};
Object.freeze(user1);

user1.name = 'kims';
user1.address.city = 'Busan';

console.log(Object.isFrozen(user1));	// true
console.log(user1.name);		// 'lee'
// deep freeze되지 않는다.
console.log(user1.address.city)		// 'Busan'

// 배열 동결
let arr = [1, 2];
Object.freeze(arr);

arr[0] = 3;
arr.push(3);	// TypeError

console.log(Object.isFrozen(arr));	// true
console.log(arr);			// [1, 2]

---

2. 객체의 방어적 복사

Object.assign(target, ...sources)

타깃 객체와 소스 객체를 매개변수로 받으며 타깃 객체에 소스 객체의 복사본을 결합시키는 방식이다. 이때 소스 객체의 프로퍼티와 동일한 프로퍼티를 타깃 객체가 가지고 있을 경우 소스 객체의 프로퍼티 값으로 덮어쓰기된다. 실행 후엔 타깃 객체를 반환한다.
첫 번째 매개변수를 타깃 객체로 인식하며 주로 빈 객체 {}를 인수로 전달한다.

.assign()은 deep copy하지 않기 때문에 객체 안의 객체(Nested Object)는 보호되지 않는다.

const user1 = {
    name : 'lee',
    address : {
        city : 'seoul'
    }
};
const user2 = Object.assign({}, user1);

// 다른 레퍼런스를 참조한다.
console.log(user1 === user2)    // false

user2.name = 'kim';
user2.address.city = 'Busan';

console.log(user1.name);    // 'lee'
console.log(user2.name);    // 'kim'
// 내부 객체는 shallow copy된다.
console.log(user1.address.city)  // 'Busan'
console.log(user2.address.city) // 'Busan'

---

참고
poiemaweb | 5.11 객체와 변경불가성
MDN | Object.freeze()