원시 값과 객체의 비교(comparison between primitive value and object)

원시 값과 객체의 다른 점 세 가지

1. immutable value vs mutable value
2. pass by value vs pass by reference(이 표현은 모던 자바스크립트 deep dive에서 값의 전달 형태를 구분하기 위해 표현됨, 실제로는 pass by sharing을 쓴다고 한다)
3. store real value vs store reference value

원시 값(primitive value)

• 값이 절대 바뀌지 않는다.(값이 바뀐다고 착각하는 이유는 변수에 새로운 값이 할당될 때 메모리 주소가 이전되는 것을 몰라서 그럴 확률이 크다.)
• 값이 저장되는 원리
  1. 변수에 할당될 표현식을 읽어 메모리 공간의 사이즈를 확보해 해당 메모리 주소에 값을 저장한다.
  2. 선언된 변수는 현 메모리 주소에서 새로운 값을 저장한 메모리 주소로 이동한다.
  3. 끝

let x = 'rabbit';
let c = x;
x = 'turtle';

console.log(x===c); // false
// c가 x를 통해 값을 할당받았지만 서로 다른 메모리 주소를 가지기 때문에
// 객체와는 다르게 서로 영향을 받지 않는다.

• 숫자와 문자열의 메모리 사이즈
  • 자바스크립트에서 숫자 타입의 원시 값은 숫자의 크기와 상관없이 8바이트의 메모리 사이즈를 가지지만 문자열은 문자당 2바이트 즉 ‘memorySize’는 10개의 문자를 가지기 때문에 20바이트의 메모리 공간을 가진다.
• 문자열
  • iterable 하고 array-like object 이기 때문에 length프로퍼티로 for 반복문 사용 가능하다.

객체

• 특징
  • 값의 변경이 가능하다.(mutable value)
  • 두 개 이상의 식별자가 하나의 객체를 공유할 수 있다. 그 뜻은 하나의 식별자를 통해 객체의 값을 변경하면 다른 식별자를 통해서 읽어도 그 값이 변경된 상태라는 것 그러니 잘못 사용하면 혼돈의 카오스가 될 여지가 있다.
  • 규정된 메모리 공간의 사이즈가 없다.
  • ? 프로퍼티의 개수가 동적으로 변할 수 있기 때문이지 않을까?
• 원시 값에 비해 객체의 비용이 많이 드는 부분?
  • 객체의 생성과 프로퍼티의 접근
• 객체 접근시 비용 절감을 위해 만들어진 프로그램은?
  • v8 엔진이다. 객체의 생성과 프로퍼티의 접근에 드는 비용(메모리 공간을 뜻하는 것이 아닐까 싶다) 문제 중에서 접근의 성능을 최적화시켰다. hidden class 방식을 사용해 접근의 성능이 c++에 유사할 정도로 뛰어나다고 한다.
  • 나중에 자바스크립트 코드의 최적화를 배우려면 v8엔진의 최적화를 참고하면 좋을 것 같다.

let x = {name: 'rabbit',
         number: '7'
        };
let c = x;
x.name = 'turtle';

console.log(x===c); // true
// x와 c는 동일한 메모리 주소를 가진 
// 하나의 객체를 같이 공유하는 관계이다.

얇은 복사(shallow copy)와 깊은 복사(deep copy)

• deep copy는 원시 값을 복사하는 것처럼 값 자체를 복사하고 shallow copy는 값이 아닌 메모리 주소를 참조하거나 참조와 값의 복사가 동시에 존재하는 두 경우가 있다.
• ? 스프레드 문법과 lodash의 cloneDeep을 예시로 얇은 복사와 깊은 복사를 설명하는데(모던 자바스크립트 deep dive) 이건 한참 뒤에 배울 내용이라 아직 정확히 이해하지 못한 부분이 아쉽다.