해시 / Object , new Map(), new Set()

1. 해시의 자료구조적 개념

• 해시 테이블(Hash Table)은 키(key) → 값(value) 쌍을 저장하는 자료구조야.
• 핵심은 키를 해시 함수로 변환 → 특정 버킷(bucket)에 저장 → 빠르게 접근.
• 평균적으로:
  • 삽입 (Insert): O(1)
  • 조회 (Search): O(1)
  • 삭제 (Delete): O(1)
• 최악의 경우 충돌(Collision) 때문에 O(n) 까지 갈 수 있음. 하지만 JS 엔진은 충돌 관리도 최적화되어 있어서 거의 O(1)에 가깝다고 보면 돼.

---

2. 자바스크립트에서 해시 역할

자바스크립트는 해시 테이블을 직접 구현하진 않아. 대신 내부적으로 객체(Object), Map, Set 등이 해시 기반으로 동작해.

(1) Object

 

const obj = {}; obj["apple"] = 100; obj["banana"] = 200; console.log(obj["apple"]); // 100

• 장점: 간단하게 키-값 저장 가능.
• 단점:
  • 키가 문자열/심볼만 가능.
  • 삽입 순서를 보장하지 않음.
  • __proto__ 같은 상속 프로퍼티 문제 가능 → 해시 맵으로 쓰기엔 불완전.

---

(2) Map

 

const map = new Map(); map.set("apple", 100); map.set("banana", 200); map.set(42, "meaning of life"); console.log(map.get("apple")); // 100 console.log(map.has(42)); // true map.delete("banana"); // 삭제

• Map이 진짜 해시맵에 가장 가까움.
• 장점:
  • 키로 모든 타입 가능 (문자열, 숫자, 객체, 함수까지).
  • 삽입 순서 기억.
  • 성능적으로 Object보다 안정적임 (대량 데이터일 때 특히).
• 단점: 구버전 브라우저에서는 지원 안 됨(ES6 이후만 가능).

---

(3) Set

• 중복 없는 값 저장용 → 내부적으로 해시 테이블처럼 구현됨.

 

const set = new Set([1, 2, 3, 3]); console.log(set); // Set { 1, 2, 3 }

---

3. 성능 비교 (Object vs Map)

• 적은 데이터 & 간단한 경우: Object로도 충분.
• 많은 데이터 & 다양한 타입 키 필요: Map이 훨씬 효율적.

예시:

 

const obj = {}; for (let i = 0; i < 1000000; i++) { obj[i] = i; } const map = new Map(); for (let i = 0; i < 1000000; i++) { map.set(i, i); }

• 둘 다 빠르지만, Map은 큰 데이터셋에서 성능이 더 안정적이고 메모리 관리도 효율적.

---

4. 해시의 효율성

• 평균 접근 시간: O(1)
• 충돌 관리 때문에 최악은 O(n) (ex. 해시 함수가 너무 단순하면 충돌↑).
• 자바스크립트 엔진(V8 등)은 내부적으로 트리 구조 + 해시를 혼합해서 쓰기도 해서 성능이 안정적임.
• 따라서 개발자는 보통 충돌 걱정할 필요 없이 Map/Object를 그대로 쓰면 됨.

---

5. 언제 어떤 걸 쓰나?

• Object
  • 단순한 key-value 저장 (특히 문자열 키).
  • JSON 변환이 필요한 경우.
• Map
  • 키 타입이 다양할 때.
  • 데이터 개수가 많을 때.
  • 삽입 순서를 유지해야 할 때.
• Set
  • 중복 제거할 때.
  • 특정 값이 존재하는지만 확인하고 싶을 때.

---

정리:
자바스크립트에서 해시는 Object/Map/Set이 내부적으로 해시 테이블처럼 동작하는 걸 말해.
성능은 평균 O(1), 충돌은 엔진이 알아서 관리해주므로 보통 신경 안 써도 돼.
실무에서 대량 데이터 & 다양한 키 쓸 때는 Map을 쓰는 게 가장 이상적이야.

 

 

Object vs Map Benchmark

• Insert: Map이 훨씬 빠름
• Lookup: 거의 비슷
• Delete: Map이 근소하게 빠름'

 

해시테이블 직접 만들어서 사용할 수도 있고

Map객체로 사용해서 써도 됨