JavaScript에서 데이터를 저장할 때 가장 많이 사용하는 자료구조 중 하나가 Object입니다.
키(Key)와 값(Value)을 한 쌍으로 저장할 수 있기 때문에
설정 정보,
사용자 데이터,
API 응답 결과 등을 관리할 때 자주 활용됩니다.
하지만 ES6가 등장하면서 Map이라는 새로운 자료구조가 추가되었습니다.
처음에는 Object와 매우 비슷해 보이기 때문에
많은 개발자들이 두 자료구조의 차이를 명확히 이해하지 못하는 경우가 있습니다.
실제로 둘 다 키와 값을 저장할 수 있으며
데이터 조회와 수정 기능도 제공합니다.
그러나 내부 동작 방식과 성능 특성,
사용 목적에는 중요한 차이가 존재합니다.
따라서 상황에 맞게 적절한 자료구조를 선택하기 위해서는
Map과 Object의 특징을 정확히 이해하는 것이 중요합니다.
Object란 무엇인가
Object는 JavaScript의 가장 기본적인 데이터 구조입니다.
객체는 속성(Property) 형태로 데이터를 저장합니다.
각 속성은 키와 값으로 구성되며
개발자는 키를 통해 원하는 데이터를 조회할 수 있습니다.
JavaScript의 거의 모든 객체는 Object를 기반으로 만들어집니다.
배열,
함수,
날짜 객체 역시 내부적으로는 객체 구조를 가집니다.
Object는 오랜 기간 JavaScript에서 데이터 저장 용도로 사용되어 왔으며
현재도 가장 널리 사용되는 자료구조 중 하나입니다.
Map이란 무엇인가
Map은 ES6에서 새롭게 추가된 키-값 저장 전용 자료구조입니다.
Object와 비슷하게 데이터를 저장하지만
보다 명확한 데이터 저장 목적을 위해 설계되었습니다.
Map은 데이터 추가,
조회,
삭제 기능을 효율적으로 제공하며
대량의 데이터를 관리할 때도 안정적인 성능을 제공합니다.
특히 Object가 가진 여러 제약 사항을 개선하기 위해 만들어졌습니다.
최근에는 데이터 저장 용도라면 Object보다 Map을 사용하는 경우도 점점 늘어나고 있습니다.
키(Key) 사용 방식의 차이
가장 큰 차이점 중 하나는 키로 사용할 수 있는 데이터 타입입니다.
Object의 키는 문자열(String) 또는 Symbol만 사용할 수 있습니다.
숫자를 키로 사용하더라도 내부적으로는 문자열로 변환됩니다.
반면 Map은 거의 모든 데이터 타입을 키로 사용할 수 있습니다.
문자열뿐만 아니라 숫자,
객체,
배열,
함수까지도 키로 지정할 수 있습니다.
이러한 유연성 덕분에 복잡한 데이터 구조를 다룰 때 Map이 더욱 강력한 선택이 될 수 있습니다.
데이터 저장 목적의 차이
Object는 본래 데이터 저장만을 위해 설계된 구조가 아닙니다.
객체의 속성을 표현하고 기능을 정의하기 위한 개념에 가깝습니다.
반면 Map은 처음부터 데이터 저장 전용 자료구조로 설계되었습니다.
따라서 데이터 추가와 삭제,
검색 기능이 보다 직관적으로 제공됩니다.
실제로 대량의 키-값 데이터를 다루는 경우에는
Map이 더 적합한 경우가 많습니다.
즉 Object는 객체 표현용,
Map은 데이터 저장용이라는 차이를 이해하는 것이 중요합니다.
순서 보장 여부
Object는 속성 순서가 항상 명확하게 보장되는 구조는 아닙니다.
최근 JavaScript 엔진에서는 일정한 규칙에 따라 순서를 유지하지만
자료구조 관점에서 순서를 관리하기 위한 용도로 설계된 것은 아닙니다.
반면 Map은 데이터가 삽입된 순서를 정확하게 유지합니다.
데이터를 순회할 때도 추가된 순서 그대로 접근할 수 있습니다.
따라서 순서가 중요한 데이터 처리에서는 Map이 더욱 안정적입니다.
특히 캐시 시스템이나 데이터 정렬 관리에서 자주 활용됩니다.
데이터 개수 확인 방법
Object는 저장된 데이터 개수를 확인하는 전용 속성이 없습니다.
일반적으로 Object.keys를 사용하여 키 배열을 생성한 뒤
길이를 계산해야 합니다.
반면 Map은 size 속성을 제공합니다.
현재 저장된 데이터 수를 즉시 확인할 수 있습니다.
따라서 데이터 개수를 자주 확인해야 하는 경우
Map이 훨씬 편리합니다.
이러한 작은 차이도 실무에서는 생산성 향상에 도움이 됩니다.
데이터 삭제 성능 비교
Object에서 특정 데이터를 삭제하려면 delete 연산자를 사용합니다.
이 방식은 사용 가능하지만
대량 데이터 환경에서는 최적화 측면에서 불리할 수 있습니다.
반면 Map은 delete 메서드를 제공하며
데이터 삭제 작업에 최적화되어 있습니다.
또한 clear 메서드를 통해 모든 데이터를 한 번에 제거할 수도 있습니다.
데이터 추가와 삭제가 빈번한 환경에서는
Map이 더 효율적인 선택이 될 수 있습니다.
반복문 순회 방식의 차이
Object는 기본적으로 반복 가능한(Iterable) 객체가 아닙니다.
따라서 직접 순회하려면 Object.keys,
Object.values,
Object.entries 등을 활용해야 합니다.
반면 Map은 기본적으로 Iterable 구조를 지원합니다.
for...of 반복문을 사용하여 바로 순회할 수 있습니다.
또한 키와 값을 함께 다루기에도 편리합니다.
데이터 순회 작업이 많은 경우 Map의 장점이 더욱 크게 나타납니다.
실무에서는 언제 Map을 사용할까
실무에서는 데이터 저장 목적에 따라 선택이 달라집니다.
사용자 정보나 설정 객체처럼 구조를 표현하는 경우에는 Object가 적합합니다.
반면 키-값 데이터 저장이 주목적인 경우에는 Map이 더 좋은 선택이 될 수 있습니다.
특히 빈번한 추가와 삭제,
대량 데이터 처리,
객체를 키로 사용해야 하는 상황에서는 Map이 강력한 장점을 제공합니다.
최근 대규모 프론트엔드 프로젝트에서도 Map 활용 비율이 꾸준히 증가하고 있습니다.
따라서 두 자료구조의 특성을 이해하고 상황에 맞게 사용하는 것이 중요합니다.
Summary
Object
• JavaScript의 기본 객체 구조.
• 키는 문자열 또는 Symbol만 사용 가능함.
• 객체 표현과 데이터 저장에 모두 활용됨.
• 가장 널리 사용되는 자료구조 중 하나임.
Map
• ES6에서 추가된 키-값 저장 전용 자료구조.
• 모든 데이터 타입을 키로 사용할 수 있음.
• 삽입 순서를 유지하며 반복문 순회가 편리함.
• 대량 데이터 처리와 빈번한 수정 작업에 유리함.