Front End/JavaScript

불변성(__**Immutability)**__

불변성 (Immutability)

불변성 개념은 JavaScript에만 존재하는 것이 아닌 다른 언어에도 존재하는 개념이다. 말 그대로 변하지 않는 것을 의미하며, 불변 데이터는 한 번 생성되고 나면 그 뒤에는 변할 수 없다.

Immutable type

JavaScript에서는 원시 타입(Boolean, String, Number, Null, undefined, Symbol)이 이에 해당된다. 이 값은 메모리영역 내에서 변경이 불가능하며 변수에 할당할 때 완전히 새로운 값이 만들어져 다시 할당된다.

let name = 'foo';
let newName = name;
name = 'bar';

console.log(newName); // foo
console.log(name); // bar

위와 같은 상황에서 name 이라는 변수의 ‘foo’ 값은 'bar' 로 수정되는 것이 아니라, 'bar' 라는 값이 메모리에 새로 생성되어 재할당 되는 것이다. (복사한다는 개념으로 봐도 좋다) 각기 다른 데이터 공간을 사용하고 있기 때문에, newName 에는 기존에 메모리에 저장되어 있던 'foo' 가 유지되어 위와 같은 콘솔 로그 결과가 나온다.

Mutable type

JavaScript에서 앞서 언급 한 원시 타입을 제외한 모든 값은 객체(Object) 타입이며 변할 수 있는 값이다. 객체는 메모리에 새로운 값을 생성하지 않고 직접 변경이 가능하다.

let x = {
  name: 'nine'
};

let y = x;

x.name = 'floor';

console.log(y.name); // floor
console.log(x === y) // true

x에 새로 객체를 할당하고 yx를 할당해 같은 주소값을 가진다. 그 다음 x의 내부에 'nine'을 대체해 'floor'를 입력하면 y도 같은 값으로 변경된다. 이는 새로운 메모리 공간에 할당하는 것이 아닌 수정 및 변경을 했기 때문이다.

상수 선언 const 에서의 불변성

상수로 선언한 변수는 일반적인 선언 let과 달리 재할당이 불가능하다. 하지만 값의 불변함을 의미하지는 않으며, 정확히는 참조하는 주소가 변하지 않는 것이라 보아야 한다. 그래서 Mutable 타입을 가진 객체의 값을 바꾸는 것은 가능하다.

const car = {
  owner : "nine",
  type : "truck"
};
car.owner = "floor";
console.log(car); // {owner: "floor", type: "truck"}


Uploaded by N2T