/ JAVASCRIPT

원시 타입과 객체

원시 타입 (Primitive Type) 과 객체(Object) 의 비교

자바스크립트는 객체 기반의 프로그래밍 언어이고, 사실상 자바스크립트를 구성하는 대부분이 객체이다.

함수도 객체이고 배열도 사실 객체이다. typeof arr 을 했을 때도 Object 라는 결과를 볼 수 있다.

typescript
console.log(typeof []); // object

원시 타입은 ‘단 하나의 값’ 만 나타내지만 ‘객체 타입’ 은 다양한 타입의 값(원시 값 또는 다른 객체)을 하나의 단위로 구성한 복합적인 자료구조이다.

원시 타입에는 number, string, boolean, null, undefined, symbol, bigint가 있고, 이 타입들은 모두 불변이다. 즉, 값을 직접 수정할 수 없다. 예를 들어, 문자열에서 일부 문자를 바꾸는 연산을 해도 기존 문자열이 바뀌는 게 아니라 새로운 문자열이 만들어진다.

typescript
let s = 'abc';
s += 'z'; 
// 여기서 단순히 s 의 마지막에 z 가 붙어서 abcz 가 되는 것이 아니라, 
// abcz 라는 문자열이 새로 만들어지고 그것이 s 에 할당된다.

let sCopy = s;
// s 의 메모리 주소가 sCopy 에 할당되는 것이 아니라, s 의 값이 복사되어 sCopy 에 할당된다.

sCopy = 'xyz';

console.log(s, sCopy); // 'abcz', 'xyz'

객체 타입은 object, array, function 처럼 참조 타입이다. 변수에는 객체 그 자체가 아니라 객체가 있는 메모리 주소가 들어간다. 그래서 객체를 다른 변수에 대입하면 값이 복사되는 게 아니라 같은 객체를 가리키는 참조가 복사된다.

typescript
let sArr = ['a', 'b', 'c'];
sArr.push('z');
console.log(sArr.join(''));
// sArr 의 맨 뒤 요소로 z 가 들어오고, join 연산 결과로 abcz 가 된다. 

let sArrCopy = sArr;
// sArr 의 참조가 sArrCopy 에 할당된다.

sArrCopy[0] = 'x';

console.log(sArr, sArrCopy); // 둘 다 ['x', 'b', 'c', 'z'];

비교 연산에서도 차이가 난다. 원시 타입은 === 비교 시 값 자체를 비교하지만, 객체는 참조 주소를 비교한다. 내용이 똑같은 객체 리터럴 두 개를 만들어도 서로 다른 객체이기 때문에 === 결과는 false가 된다.

typescript
const s1 = 'abc';
const s2 = 'abc';

console.log(s1 === s2); // true

const arr1 = [1, 2, 3];
const arr2 = [1, 2, 3];

console.log(arr1 === arr2); // false