언어/Javascript

[JS] Map, Object, JSON 비교하기

thinktank911 2025. 9. 23. 16:36

db.size는 되는데 req.body.size는 안 되는 이유

개발하다 보면 이런 상황을 한 번쯤 경험했을 것이다.

“내 Map 객체 db는 db.size로 크기를 확인할 수 있는데, 클라이언트에서 받은 req.body는 size를 확인하려 하니 undefined가 발생한다!”

이번 글에서는 왜 이런 문제가 발생하는지Map, Object, JSON의 차이를 함께 정리해보겠다.


1. 문제 상황


// Map 객체
const db = new Map();
db.set("홍길동", { age: 20 });
console.log(db.size); // 1 ✔

app.post('/user', (req, res) => {
  const userInfo = req.body;
  console.log(userInfo.size); // undefined ❌
});

- db는 Map이므로 .size로 요소 개수를 바로 확인할 수 있다.

- req.body는 JSON이 Object로 파싱되므로 .size가 없고, 따라서 undefined가 발생한다.

 


2. 원인 분석

2-1. db는 Map

Map은 컬렉션 자료구조(Collection Data Structure)이다.

  • 키: 모든 자료형 사용 가능 (문자열, 객체, 함수 등)
  • 크기 확인: .size 속성으로 가능
  • CRUD 메서드 제공: set, get, has, delete
const map = new Map();
map.set("key", "value");
console.log(map.size); // 1

2-2. req.body는 Object

클라이언트가 보낸 JSON은 Express에서 자동으로 JS Object로 변환된다.

  • 키: 문자열 또는 심볼만 가능
  • 크기 확인: Object.keys(obj).length 사용
  • 내장 .size가 없으므로 undefined 발생
const obj = { name: "홍길동", age: 20 };
console.log(Object.keys(obj).length); // 2 ✔
console.log(obj.size); // undefined ❌

3. Map과 Object의 차이

항목 Map Object
모든 타입 가능 문자열/심볼
크기 확인 .size Object.keys(obj).length
CRUD 풍부한 메서드 제한적 (delete, in 등)
순회 삽입 순서 100% 보장 순서 일부 제한
용도 데이터 컬렉션, 캐시, 키-값 저장소 엔티티 표현, JSON 직렬화 가능

 


4. 컬렉션 자료구조란?

컬렉션 자료구조(Collection Data Structure)란 데이터를 여러 개 묶어서 관리하는 구조를 의미한다.

JavaScript에서 대표적인 컬렉션:

  • Map
  • Set
  • WeakMap
  • WeakSet

Object와 비교하면 다음과 같다:

  • Object: 단일 엔티티(Entity) 표현
  • Map/Set: 데이터 집합 관리, 삽입/삭제/검색 효율적

5. JSON vs Object

  • JSON: 문자열 포맷, 데이터 교환용
  • Object: 실제 JS 데이터 구조, 메모리 상 객체

5-1. JSON 직렬화

JS 객체를 JSON 문자열로 바꾸는 과정을 JSON 직렬화라고 한다. 주로 파일을 저장하거나 HTTP로 전송할 때 사용

5-2. JSON 역직렬화

JSON 문자열을 다시 JS 객체로 바꾸는 과정을 JSON 역직렬화라고 한다.


// JSON 문자열
const json = '{ "name": "홍길동", "age": 20 }';

// Object로 변환 (역직렬화)
const obj = JSON.parse(json);
console.log(obj.name); // "홍길동"

// Object → JSON (직렬화)
const str = JSON.stringify(obj);
console.log(str); // '{"name":"홍길동","age":20}'

비유하자면, JSON은 택배 박스이고 Object는 실제 물건과 같다.


6. JSONObject란?

JavaScript에는 공식적으로 JSONObject라는 타입은 존재하지 않는다.

  • 흔히 “JSON처럼 생긴 JS 객체”를 의미
  • Java 등 다른 언어에서는 실제 JSONObject 클래스 존재
  • JS에서는 JSON을 파싱한 Object라고 이해하면 된다

7. JSON Object vs JSON Array

  • JSON Object: {} 시작 → JS Object
  • JSON Array: [] 시작 → JS Array
// JSON Object
const jsonObj = '{ "name": "홍길동", "age": 20 }';
const obj = JSON.parse(jsonObj);

// JSON Array
const jsonArr = '[{ "name": "홍길동" }, { "name": "임꺽정" }]';
const arr = JSON.parse(jsonArr);

8. 실무 예시: Express req.body


app.post('/user', (req, res) => {
  const userInfo = req.body; // 자동으로 Object/Array 변환
  console.log(Object.keys(userInfo).length); // Object이면 크기 확인 가능
});

따라서 userInfo.size는 undefined이고, Object의 크기는 Object.keys(userInfo).length로 확인해야 한다.

 


9. Map vs Object 선택 기준

구분 Map Object
모든 타입 가능 문자열/심볼
크기 확인 .size Object.keys(obj).length
CRUD 편의성 풍부한 메서드 제한적
순회 삽입 순서 100% 보장 순서 일부 제한
용도 컬렉션, 캐시, 데이터 묶음 엔티티, 설정값, JSON 직렬화

 


10. 결론

  • Map: 컬렉션 자료구조, 키-값 관리에 최적화
  • Object: 단일 엔티티 표현, JSON 직렬화에 유리
  • JSON: 문자열 포맷, 데이터 교환용
  • JSONObject: JS에서는 공식 용어 아님 → JSON 파싱 후 Object
  • JSON Array vs Object: 시작 문자를 보면 구분 가능 (`[` vs `{`)

이번 글을 통해 “왜 db.size는 되고 req.body.size는 안 되는지”부터 시작해서 Map, Object, JSON까지 명확히 구분할 수 있을 것이다.