객체

필자는 자바스크립트에서의 객체는 자바스크립트  그 자체라고도 생각할 정도로 중요하다고 생각한다. 

객체는 함수와도 밀접한 관계를 갖고 있으며 그렇기 때문에 객체를 알아야  함수를 알 수 있고,

함수를 알아야 객체도 알 수 있다고 생각한다.

 

객체

객체는 프로퍼티의 개수가 정해져 있지 않으며, 동적으로 추가되고 삭제시킬 수 있다.

또한 프로퍼티 값의 제약도 없다. 따라서 객체는 원시 값과 같이 확보해야 할 메모리 공간의 크기를 사전에 정해 둘 수 없다.

객체는 복합적인 자료구조 이므로 객체를 관리하는 방식이 원시 값과 비교해서 복잡하고 구현 방식도 브라우저 제조사마다 다를 수 있다.

원시 값은 상대적으로 적은 메모리를 소비하지만 객체는 경우에 따라 크기가 매우 클 수도 있다.

객체를 생성하고 프로퍼티에 접근하는 것도 원시 값과 비겨할 때 비용이 많이 드는 일이다.

따라서 객체는 원시 값과는 다른 방식으로 동작하도록 설계되어 있다.

 

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

 

person이라는 변수에 객체 데이터 할당

원시 값을 할당한 변수가 기억하는 메모리 주소를 통해 메모리 공간에 접근하면 원시 값에 접근할 수 있다.

즉, 원시 값을 할당한 변수는 원시 값 자체를 값으로 갖는다. 하지만 객체를 할당한 변수가 기억하는 메모리 주소를 통해

메모리 공간에 접근하면 참조 값에 접근할 수있다. 참조 값은 생성된 객테가 저장된 메모리 공간의 주소, 그 자체다.

 

객체의 할당

원시 값을 할당한 변수를 참조하면 메모리에 저장되어 있는 원시 값에 접근한다. 하지만 객체를 할당한 변수를 참조하면 메모리에

저장되어 있는 참조 값을 통해 실체 객체에 접근한다.

 

객체를 출력

원시 값을 할당한 변수의 경우 "변수는 x값을 갖는다" 또는 "변수의 값은  x다"라고 표현한다.

하지만 객체를 할당한 변수의 경우 "변수는 객체를 참조하고 있다."또는  "변수는 객체를 가리키고 있다." 라고 표현한다.

위 예제에서 person 변수는 객체 {name: 'Lee'} 를 가리키고(참조하고) 있다.

 

원시 값은 변경 불가능한 값이므로 원시 값을 갖는 변수의 값을 변경하려면 재할당 외에는 방법이 없다.

하지만 객체는 변경 가능한 값이다. 따라서 객체를 할당한 변수는 재할당 없이 객체를 직접 변경할 수 있다.

즉 재할당 없이 프로퍼티를 동적으로 추가할 수도 있고 프로퍼티 값을 갱신할 수도 있으며 프로퍼티 자체를 삭제할 수도 있다.

 

person객체의 프로퍼티 값 동적으로 수정 ,  생성

원시 값은 변경 불가능한 값이므로 원시 값을 갖는 변수의 값을 변경하려면 재할당을 통해 메모리에 원시 값을 새롭게 생성해야한다.

하지만 객체는 변경 가능한 값이므로 메모리에 저장된 개체를 직정 수정 할 수 있다.

이때 객체를 할당한 변수에 재할당을 하지 않았으므로 객체를 할당한 변수의 참조 값은 변경되지 않는다.

객체는 변경 가능한 값이다.

객체를 생성하고 관리하는 방식은 매우 복잡하며 비용이 많이 드는 일이다. 객체를 변경할 때 마다 원시 값처럼 이전 값을 복사해서 새롭게 생성한다면 명확하고 신뢰성이 확보되겠지만 객체는 크기가 매우 클 수 도있고, 원시 값처럼 크기가 일정하지도 않으며, 프로퍼티 값이 객체

일 수도 있어서 복사해서 생성하는 비용이 많이 든다. 메모리의 효율적 소비가 어렵고 성능이 나빠진다.

따라서 메모리를 효율적으로 사용하기 위해, 그리고 객체를 복사해 생성하는 비용을 절약하여 성능을 향상시키기 위해 객체는 변경 가능한 값으로 설계되어 있다. 메모리 사용의 효율성과 성능을 위해 어느 정도의 구조적인 단점을 감안한 설계라고 할 수 있다.

객체는 이러한 구조적 단점에 따른 부작용이 있다, 그것은 원시 값과는 다르게 여러개의 식별자가 하나의 객체를 공유 할 수 있다.

객체를 프로퍼티 값으로 갖는 객체의 경우 얕은 복사는 한 단계까지만 복사하는 것을 말하고

깊은 복사는 객체에 중첩되어 있는 객체까지 모두 복사하는 것을 말한다.

 

얕은 복사와 깊은 복사로 생성돤 객체는 원보과는 다른 객체다. 원본과 복사본은 참조 값이 다른 별개의 객체다.

하지만 얕은 복사는 객체에 중첩되어 있는 객체의 경우 참조 값을 복사하고 깊은 복사하고 깊은 복사는 객체에 중첩되어  있는

객체까지 모두 복사해서 원시 값처럼 완전한 복사본을 만든다는 차이가 있다.

얕은 복사 깊은복사

깊은복사와 얕은복사

 

책:모던 자바스크립트 Deep Dive