📆 날짜 : 2023/12/05(화)

📚 챕터 : 원시타입과 객체타입의 특징 및
값을 저장하는 방식의 차이

---

🎯 학습 내용

원시 타입과 객체 타입의 가장 큰 차이점은 값을 저장하는 방식이다.
값을 어떻게 저장하냐에 따라 동등 비교를 할 때 차이를 만든다.
먼저 원시 타입은 불변 형태의 값으로 저장된다.
이 값은 변수 할당 시점에 메모리 영역을 차지하고 저장된다.
아래 예제 코드를 살펴보자

<script>
let hello = 'hello world'
let hi = hello

console.log(hello === hi) // true
</script>

당연히 두 값을 비교하면 true가 반환된다.
hello 변수의 hello world 값이 hi라는 변수에 hello 값 자체를 할당함으로써 복사해 전달됐기 때문이다.

반면 객체는 프로퍼티를 추가,수정,삭제가 가능 하므로 원시 값과 다르게
변경 가능한 형태로 저장되며, 값을 복사할 때도 값이 아닌 참조를 전달하게 된다.
아래 예제 코드를 살펴보자

<script>

var hello = {greet : 'hello world',}

var hi = {greet : 'hello world',}

console.log(hello === hi); //false

console.log(hello.greet === hi.greet);//true

</script>

원시타입은 값을 저장한다면 객체는 값을 저장하는게 아닌 참조를 저장하기 때문에
hello와 hi을 동등비교했을 때 false를 반환한다.
값은 같지만 참조하는 곳이 다른 셈이다.
반면 참조를 전달하는 경우에는 원시값에서 했던 것과 같은 결과를 기대할 수 있다.
객체의 hello와 hi 변수는 변수명의 주소가 서로 다르지만
value의 주소는 동일하다.

반면에 아래 예제 코드에서는
{greet : 'hello world'} value 값을 hello.greet = 'something'과 같이 변경을 해도
hi와 hello 동등 비교를 했을 때 언제나 true를 반환한다.

<script>
var hello = {greet : 'hello world',};

var hi = hello

console.log(hi === hello);//true

hello.greet = 'something';

console.log(hi === hello);//true
</script>

다음 글은 자바스크립트의 또 다른 비교 공식 Object.is 대해 알아보자.