자바스크립트 타입의 불변성

자바스크립트의 원시타입은 불변성(immutable)이고 참조타입은 가변성(mutable)이다. 

 

원시 타입: Boolean, String, Number, null, undefined, Symbol 

참조 타입: Object, Array

 

원시타입은 Call Stack에 저장을하고 참조타입은 Heap에 저장을 하는데 저장하는 방식이 다르다. 

둘다 주소와 값을 가지고 있는 형태인데 

Heap이 값을 배열형태로 가지고있는데. 이 값의 주소를 Call Stack에서 Heap의 메모리 참조의 ID를 값으로 저장한다. 

원시타입: 고정된 크기로 Call Stack 메모리에 저장, 실제 데이터가 변수에 할당.

참조타입: 데이터 크기가 정해지지 않고 Call Stack 메모리에 저장, 데이터의 값이 heap에 저장되고 변수에 heap 메모리 주소값이 할당된다. 

원시타입	let username = "walter" username = "john"	이것은 username walter를 john으로 대체한 것이 아니고 메모리 영역 a에 있는 walter라는 값을 그대로 두고 메모리 영역 b에 john을 새로 할당한 거다. (그래서 리액트에서 불변성을 위해 따로 신경 써주지 않아도 된다.)
참조타입	let array = ['1', '2', '3'] array = ['4', '5', '6']	배열에 대한 요소를 추가하거나 객체 속성값을 변경할 때 Call Stack의 참조 ID는 동일하고 Heap메모리에서만 변경된다. (불변성 유지가 되지않아 리액트에서 따로 신경을 써줘야한다.)

const array = [1,2,3,4];
const sameArray = array;
sameArray.push(5);

console.log(array === sameArray); // true


const array = [1,2,3,4];
const differentArray = [...array,5];
console.log(array === differentArray); // false