원시 값과 객체를 비교해보세요.(딥다이브 11장)

자바스크립트 데이터타입

자바스크립트가 제공하는 데이터타입은 7가지이고, 이는 원시 타입(Primitive type)과 객체 타입(Object/Reference typr)으로 구분할 수 있습니다. 원시타입인 숫자 / 문자열 / null / undefined / boolean / symbol 외에는 모두 객체 타입입니다.

원시타입과 객체타입을 구분하는 3가지 이유

원시값

한번 갱성된 원시 값은 읽기 전용(read only) 값으로서 변경할 수 없다.

값이란?

변수에 저장된 데이터로서 표현식이 평가되어 생성된 결과를 의미
변수에 저장된 값 자체를 변경할 수 없다는 것이지, 변수는 재할당을 통해 변수값을 교체할 수 있다.
교체하려면 원시 값을 재할당하여 새로운 메모리 공간을 확보하고 재할당한 값을 저장한 후, 변수가 참조하던 메모리 공간의 주소를 변경해야 한다. 값의 이러한 특성을 불변성(immutability)이라 한다.

값에 의한 전달

변수에 원시 값을 갖는 또 다른 변수를 할당하면 할당받는 변수에는 할당되는 변수의 원시값이 복사되어 전달된다. 이를 값에의한 전달이라 한다.
복사되어 전달 되지만 두 값은 다른 메모리 공간에 저장된 별개의 값으로, 서로 어떠한 영향도 주지 않는다.

객체

객체(참조) 타입의 값, 즉 객체는 변경 가능한 값(mutable value)이다.

변경 가능하다는 의미는?

원시값을 갖는 변수의 값을 변경하려면 재할당외에는 방법이 없지만, 객체는 재할당 없이 프로퍼티를 동적으로 추가할 수도 있고 프로퍼티 값을 갱신할 수도 있으며 프로퍼티 자체를 삭제할 수 있다. 왜냐하면 객체를 갖는 변수가 갖는 값은 참조값으로 메모리 공간의 주소 그 자체다. 그 참조 값으로 실제 객체에 접근하는 것이다.

얕은 복사 vs. 깊은 복사

스프레드 문법(...)으로 참조값만을 복사하는 것을 얕은 복사라고 하며 얕은 복사를 한 변수는 복사한 그 객체와 참조값(메모리 주소)만 같을 뿐 다른 값이다. 이와 다르게 깊은 복사는 중첩되어 있는 객체까지 모두 복사하는 것으로 둘은 같은 값을 가리킨다.

참조에 의한 전달

값에 의한 전달과 참조에 의한 전달은 식별자가 기억하는 메모리 공간에 저장되어 있는 값을 복사해서 전달한다는 면에서 동일하다.
값에 의한 전달은 원시값 그 자체를 전달하고, 참조에 의한 전달은 참조값(메모리 주소)을 전달하는 것이 다른 것이다.

=== 일치 비교 연산자

=== 일치 비교 연산자는 변수에 저장되어 있는 값을 타입 변환하지 않고 비교한다.
객체를 할당한 변수는 참조 값을 가지고 있고,
원시값을 할당한 변수는 원시 값 자체를 가지고 있으므로
=== 일치 비교 연산자를 통해 객체에 할당한 변수를 비교하면 참조 값(메모리 주소)을 비교하고
원시 값을 할당한 변수를 비교하면 원시 값을 비교하는 것이다.

느낀점

같은 형태의 객체를 === 일치비교 연산자로 비교했을때 false가 나오는 것을 이해하지 못했는데 그 원리를 이해할 수 있어서 좋았다.
단순히 코드를 짜는 것에 그치지않고 그 안에 작동되는 원리를 이해하려고 노력해야겠다.