[JavaScript] 객체 변경 불가성

(1) Immutable Value

- JavaScript의 원시 타입은 변경 불가능한 값이다.

- 객체 타입은 변경 가능한 값(mutable value)이다.

- 변경 불가능한 값이란 메모리 영역에서 변경이 불가능하다는 뜻이다.

var a = 'Hello'; // string은 immutable value
a = 'world';

// 즉, hello의 문자열이 변경이 되는 것이 아니라 world, hello 각각 메모리에 할당된다.

var information= {
  name: 'eddy',
  age: '26'
};

var myname = information.name;   // 변수 myname은 string 타입이다.

information.name = 'wangi';
console.log(myname);             // 'eddy'

myname = information.name;       // 재할당
console.log(myname);             // 'wangi'

var test = information;          // 변수 test는 객체 타입이다.

test.name = 'park';

console.log(information.name);   // park
console.log(test.name);          // park
// 즉, 객체를 가리키면 변경이 가능하다.

(2) 불변 데이터 패턴 (immutable data pattern)

- 의도하지 않은 객체의 변경 해결 방법 : 객체를 불변 객체로 만들거나 객체의 방어적 복사를 한다.

- 객체의 방어적 복사(defensive copy) : Object.assign

// Object.assign(target, ...sources)

const x = { a: 1 };
const y = Object.assign({}, x);            // 빈 타겟에 x 객체 복사
console.log(y);                            // { a: 1 }


// Merge
const i = { a: 1 };
const j = { b: 2 };
const k = { c: 3 };

const m = Object.assign(i, j, k);           // tagrget i에 j, k 를 합병 후 복사
const n = Object.assign(i, j, k, {c:5});
console.log(m);                             // { a: 1, b: 2, c: 3 }
console.log(n);                             // { a: 1, b: 2, c: 5 } // 중복되는 프로퍼티가 있으면 덮어 씌어진다.
console.log(i);                             // { a: 1, b: 2, c: 3 } target 객체도 변경이 된다.

- 불변 객체화 : Object.freeze

var information= {
	name: 'eddy',
	age: '26',
	school:{
		middle: '정각중'
	}
};

const a = Object.assign({}, information, {name: 'wangi'});

console.log(information.name);             // 'eddy'
console.log(a.name);                  	   // 'wangi'

Object.freeze(information);

information.name = 'wangi';                //  변경되지 않는다.
information.school.middle = '만수중';      // 내부 객체는 변경이 된다. 내부 객체를 변경 불가능으로 만들려면 deep freeze를 해야한다.
console.log(information);                  // { name: 'eddy', age: '26', school:{middle: '만수중' }
console.log(Object.isFrozen(information)); // true