🔍 JavaScript에서 원시값과 객체의 차이

JavaScript에서는 데이터를 다룰 때 원시값(Primitive)과 객체(Object) 두 가지 타입으로 분류합니다.
이 두 타입은 저장 방식, 복사 방식, 비교 방식 등에서 큰 차이를 보이며, JS를 이해하기 위해 꼭 알아야 하는 중요한 개념입니다.

---

✅ 1. 원시값(Primitive Value)

원시값은 더 이상 나눌 수 없는 단일 데이터입니다.
JS의 원시 타입은 총 7가지로, 변경 불가능한(immutable) 값입니다.

📌 원시 타입 종류

• string
• number
• boolean
• null
• undefined
• symbol
• bigint

📌 특징

• 값 자체를 저장
• 복사 시 독립된 값으로 복사됨
• 비교는 값 자체로 이루어짐

// a와 b는 서로 영향을 주지 않습니다. 값 자체가 복사되기 때문입니다.
let a = 10;
let b = a;

b = 20;

console.log(a); // 10
console.log(b); // 20

✅ 2. 객체(Object)

• 객체는 여러 값을 하나의 변수에 담을 수 있는 자료형입니다.
• JS에서 객체는 키-값 쌍으로 데이터를 저장하며, 함수, 배열, 날짜 등도 객체에 포함됩니다.

📌 객체 타입 종류

• 일반 객체 { key: value }
• 배열 [1, 2, 3]
• 함수 function() {}
• 날짜 new Date()

📌 특징

• 참조(주소값)를 저장
• 복사 시 주소값만 복사됨 (같은 객체를 가리킴)
• 비교는 참조값(주소)을 기준으로 함

// obj1과 obj2는 같은 객체를 참조하고 있기 때문에, 한 쪽을 변경하면 다른 쪽도 바뀐 값을 반영합니다.
let obj1 = { name: "Kim" };
let obj2 = obj1;

obj2.name = "Lee";

console.log(obj1.name); // "Lee"

✅ 3. 원시값(Primitive) vs 객체(Object) 정리표

항목	원시값 (Primitive)	객체 (Object)
저장 방식	값 자체 저장	참조값(메모리 주소) 저장
복사 방식	값 복사 (독립적)	참조 복사 (얕은 복사, 같은 객체 참조)
비교 방식	값 비교 (=== → true)	참조 주소 비교 (=== → false)
변경 가능성	불변(immutable)	가변(mutable)
저장 위치	스택(Stack)	힙(Heap)
대표 예시	10, 'hello', true	{ name: "Kim" }, [1, 2, 3]
복사 예시	let b = a; → b와 a는 독립된 값	let obj2 = obj1; → 같은 객체 참조
비교 예시	10 === 10 → true	{a:1} === {a:1} → false
기타 특징	연산 시 값 자체 사용됨	메서드, 배열 등 다양한 구조 표현 가능

---

💡 객체를 다룰 때는 얕은 복사 vs 깊은 복사, 불변성 유지, 참조에 따른 부작용을 꼭 고려해야 합니다!

✅ 4. 객체 비교 예시

let person1 = { name: "Kim" };
let person2 = { name: "Kim" };

console.log(person1 === person2); // false
console.log(person1.name === person2.name); // true

객체는 내용이 같아도 서로 다른 메모리 주소를 가지고 있기 때문에 === 비교는 false를 반환합니다.
내부 속성의 값을 비교하면 true가 나올 수 있습니다.

✅ 5. 결론

• 원시값은 값 자체가 저장되며, 복사나 비교 시에도 값 중심으로 동작합니다.
• 객체는 참조형으로, 복사나 비교 시 주소 중심으로 동작하므로 불변성 유지를 고려한 코드 작성이 중요합니다.
• 객체를 다룰 땐 얕은 복사 / 깊은 복사, 불변성, 참조 문제에 대한 이해가 필수입니다.

🔁 얕은 복사 vs 깊은 복사

// 얕은 복사
let objA = { name: "Kim", address: { city: "Seoul" } };
let objB = { ...objA };
objB.address.city = "Busan";

console.log(objA.address.city); // "Busan" (같은 참조)

// 깊은 복사
let objC = structuredClone(objA);
objC.address.city = "Incheon";

console.log(objA.address.city); // "Busan"
console.log(objC.address.city); // "Incheon"