원시 값과 객체의 비교

JS에서 값은 원시 타입과 객체 타입으로 구분

구분하는 이유

• 원시 타입의 값은 변경 불가능한 값, 객체 타입의 값은 변경 가능한 값
• 메모리 관점에서 원시 값을 변수에 할당하면 변수에는 실제 값이 저장되고 객체를 변수에 할당하면 참조 값이 저장된다.

원시 값

1. 변경 불가능한 값
2. 값에 의한 전달

변경 불가능한 값

• 한 번 생성된 원시 타입의 값은 읽기 전용으로 값을 변경할 수 없다.
• 변수에 값이 재할당되면 그 메모리 공간에 다시 값을 쓰는 것이 아니라 새로운 메모리 공간을 할당한다. (자세한 내용은 변수에서 확인할 수 있다.)
• 결국, "원시 값이 변경 불가능하다." 라는 말은 원시 값 자체를 변경할 수 없다는 것이지 변수 값을 변경할 수 없다는 것이 아니다. 변수 값은 재할당을 통해 언제든지 변경할 수 있다.
• 이러한 특성을 불변성(Immutability)이라고 한다.
• 불변성을 갖는 원시 값을 할당한 변수는 재할당 이외에 변수 값을 변경할 방법이 없고 이는 상태 변경 추적이 용이하고 데이터의 신뢰성을 보장한다.

값에 의한 전달

var number = 80;
var copy = number;

console.log(number);
console.log(copy);
console.log(number === copy);

// 결과
80
80
true

• number는 변수 값 80으로 평가되므로 copy 변수에도 80이 할당될 것이다. 이 때, 새로운 숫자 값 80이 생성되어 copy 변수에 할당된다.
• 이처럼 변수에 원시 값을 갖는 변수를 할당하면 할당받는 변수(copy)에는 할당되는 변수(number)의 원시 값이 복사되어 전달된다. 이를 값에 의한 전달이라고 한다.
• 중요한 것은 number와 score 변수의 값이 동일한 값을 갖지만 다른 메모리 공간에 저장된 별개의 값을 갖는다.

객체

1. 변경 가능한 값
2. 참조에 의한 전달

변경 가능한 값

• 원시 값을 할당한 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 원시 값에 접근할 수 있다. 즉, 원시 값 자체를 값으로 갖는다.
• 하지만, 객체를 할당한 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 객체를 가지고 있는 메모리 공간의 주소 값에 접근할 수 있다. 즉, 참조 값을 값으로 갖는다.

var employee = {
  nickname: "lian",
  department: "development",
  dateOfEntering: 1,
  salary: 4000,
};

• 변수 employee가 기억하는 메모리 주소(0x000000FA)에 접근하면 객체를 가지고 있는 메모리 공간의 주소인 참조 값 0x00001332이 나온다.
• 이 참조 값을 통해 다시 객체에 접근한다.
• 원시 값은 변경 불가능한 값이기 때문에 값을 변경하려면 재할당 외에는 방법이 없지만 객체는 재할당 없이 객체를 직접 변경할 수 있다.
• 즉, 재할당 없이 프로퍼티를 동적으로도 추가할 수 있고 프로퍼티 값을 갱신할 수 있다. 또한, 프로퍼티 자체를 삭제할 수 있다.
• 이때, 객체를 할당한 변수에 재할당을 하지 않았으므로 객체를 할당한 변수의 참조값은 변경되지 않는다.

employee.dateOfEntering = 2;
employee.salary = 4500;
employee.email = "velog@velog.io";

// 결과
{
  nickname: 'lian', 
  department: 'development', 
  dateOfEntering: 2, 
  salary: 4500, 
  email: 'velog@velog.io'
}