immutable vs mutable

1.immutable

:  자료형 String(문자열), Number(숫자), Boolean(참/거짓), undefined, null은 immutable(변경불가능한) 객체

2. mutable

: Function(함수), Array(배열), Object(객체)은 mutable(변경가능한) 객체 

이 외에 immutable 하지 않은 모든 것들을 포함

 

 

3. immutable 객체의 메모리 참조

 

let num1 = 0;
let num2 = num1;

num1 = 100;

console.log(num1); // 100
console.log(num2); // 0

immutable 객체 참조 모습

num1 = 100에서 immutable 영역의 0이 변경되지 않고 100이라는 값이 새로 할당됨 

아래에서 나올  mutable 객체의 값이 변경(obj1.value = 100)되는 모습과 다르게 동작한다.

4. mutable 객체의 메모리 참조

let obj1 = {};
let obj2 = obj1;

obj1.value = 100;

console.log(obj1); // { value: 100 }
console.log(obj2); // { value: 100 }

 

mutable 객체 참조 모습

obj1의 값을 변경해도 obj2에도 영향을 주는 이유는 그림처럼 obj1과 obj2가 실제로는

mutable 영역의 같은 객체를 참조하도록 작성되었기 때문이다. (var obj2 = obj1)

 

let obj1 = {};
let obj2 = {};

obj1.value = 100;

console.log(obj1); // { value: 100 }
console.log(obj2); // { }

 

같은 빈 객체지만 다른 영역에 생성된 모습

 

5. 함수에서의 참조(파라미터)

let score = 80;
let person = {name:'yuddomack', age:28};

function changeScore(score){
  score = 30;
}
function changeName(person){
  person.age = 40;
}

changeScore(score);
changeName(person);
console.log(score); // 80
console.log(person); // { name: 'yuddomack', age: 40 }

 

changeScore를 통해 score를 30으로 바꾸고, changeName을 통해 person객체의 age를 40으로 변경한다.

그런데 person객체의 age는 변경되었지만 score는 여전히 80이다

왜냐하면 person객체는 mutable이고 score는 immutable이기 때문이다.

 

 

 

changeScore()에서 지역 변수 score는 40이라는 값을 새로 참조하고,

함수(유효 스코프)가 종료되며 소멸(immutable 이기 때문에 40은 사라지고 전역 변수 score =80만 남음)