📖 primitive type과 object type

이번 포스팅에서는 자바스크립트의 7가지 데이터 타입에 대해 살펴보자! 😊😊

원시값 vs 객체

자바스크립트는 7가지의 데이터 타입을 제공하고 이는 크게 primitive(원시) type과 object(객체) type 두가지로 나눌 수 있다. 원시 타입과 객체의 주된 차이는 mutability이다.

💡 원시 타입은 한번 선언되면 변경이 불가능하고, 객체 타입은 변경이 가능하다.

Primitive type

primitive type(원시 타입)의 특징을 알아보자.

• number, string, boolean, undefined, null, symbol type
• 할당 시 변수에는 실제 값(value)이 저장된다.
• 다른 변수에 할당 시 '값'이 복사되어 전달된다. (pass by value)
• 변경 불가능한 값이다. 수정을 하면 새로운 주소에 값이 할당된다.

let str1 = 'hello';
str1 = 'world';

앞서 언급 했듯이 object타입과 primitive type을 나누는 주된 기준은 수정 가능 여부이다.

위의 코드와 같이 기존의 str1값 변경 시 기존의 메모리 주소에 접근해 해당 value를 수정하는 것이 아니라, 새로운 메모리 주소에 'world'라는 문자열을 할당하고 str1에 해당 메모리 주소를 할당하게 된다.

let str2 = 'original string';
str2[2] = 'B';
console.log(str2); // original string 출력

primitive type 형식의 변수 값 변경 시도 시 에러를 발생시키지는 않지만, 수정 사항이 반영되지 않는다.

Object type

• 객체, 함수 배열 등 자바스크립트의 거의 모든것이 객체이다.
• 할당 시 변수에는 메모리 주소(참조값)이 저장된다.
• 다른 변수에 할당 시 '참조'값이 할당되어 같은 객체를 공유하게 된다.
• 수정이 가능하기 때문에 property를 동적으로 추가하는 것도, 삭제하는것도 가능하다.

객체는 대입연산이 진행됐을시에 새로운 객체를 생성하는 것이 아니라 같은 주소공간을 참조하게 된다.

person = {
  name: 'Lee'
};

let copy = person;

copy.name = 'Kim';
console.log(person.name); // 'Kim' 출력

person과 copy 객체는 같은 주소공간을 참조하기 때문에 한 객체의 값을 변경하면 다른 객체의 값도 변경이 된다.

정리

primitive type(원시 타입)과 object type(객체 타입)에 주된 차이에 대해 알아보았다.
마지막으로 키워드를 정리해보자!

원시값과 객체값의 주된 차이 3가지는 다음과 같다.

• 원시 값은 수정 불가능하고, 객체 값은 수정이 가능함
• 원시 값을 변수에 할당하면 실제 값이 저장되고, 객체는 주소값이 저장됨
• 원시 값을 변수에 대입하면 실제 값이 복사되어 저장되고, 객체는 주소값이 복사되어 저장됨