OPEN HYPER STEP
← 목록으로 (JavaScript)
JS · 25 / 34
js
CHAPTER 25 / 34
읽기 약 2
FUNCTION

Map & Set 자료구조


핵심 개념

Map은 키-값 쌍을 저장하며 키로 어떤 타입도 사용 가능합니다. 객체와 달리 삽입 순서를 보장하고 size 속성으로 크기 확인이 가능합니다. Set은 중복 없는 값의 집합입니다. has(), add(), delete()로 조작합니다. WeakMap과 WeakSet은 가비지 컬렉션이 가능한 약한 참조 버전입니다. Map/Set 메서드를 지우며 자료구조가 붕괴되는 것을 확인하십시오.

코드 분석
JS📋 코드 (15줄)
const unitMap = new Map();
  unitMap.set('T-800', { threat: 8, active: true });
  unitMap.set('T-1000', { threat: 10, active: true });
  unitMap.set('T-X', { threat: 9, active: false });

  const threatSet = new Set([8, 10, 9, 8, 10, 7]);

  document.write('<div style="color:#10b981;margin-bottom:6px;">MAP (size: ' + unitMap.size + '):</div>');
  unitMap.forEach((val, key) => {
    document.write('<div style="margin-bottom:2px;">' + key + ' → threat:' + val.threat + ' active:' + val.active + '</div>');
  });

  document.write('<div style="color:#f59e0b;margin:8px 0 6px;">SET (중복 제거, size: ' + threatSet.size + '):</div>');
  document.write('<div>[' + [...threatSet].join(', ') + ']</div>');
  document.write('<div style="color:#22c55e;margin-top:6px;">has(10): ' + threatSet.has(10) + ' | has(5): ' + threatSet.has(5) + '</div>');

AI 프롬프트
🤖 AI에게 잘 물어보는 법 — 모델·전략별 프롬프트
Claude

무료: Sonnet 4.6 / Pro $20/mo: Opus 4.6

이 JS 'Map & Set 자료구조' 코드의 잠재적 버그와
메모리 누수·this 바인딩·비동기 경합 위험을
분석해서 프로덕션 수준으로 개선해줘.
ChatGPT

무료: GPT-5.5 / Plus $20/mo: GPT-5.5 Pro

'Map & Set 자료구조'를 실제 서비스에서 어떻게 쓰는지
구체적 사례 3개와 복사 가능한 코드를
초보자가 이해할 수 있게 보여줘.
Gemini

무료: 2.5 Flash / Pro $19.99/mo: 3.1 Pro

이 JS 'Map & Set 자료구조' 관련 코드 전체의 실행 흐름을 분석하고
성능 병목과 최적화 방안을 우선순위로 알려줘.
Grok

무료: Grok 4.1 / SuperGrok $30/mo

'Map & Set 자료구조'에서 개발자들이 가장 많이 하는
실수 Top 3을 솔직하게 알려주고
2026년 권장 패턴을 함께 알려줘.

⭐ 이것만 기억하세요
Map & Set 자료구조 이 3가지만 확실히 잡으세요
1.일반 객체를 Map처럼 쓰면 키가 문자열로 강제 변환되고, 프로토타입 키 충돌 위험이 있습니다
2.Map은 어떤 타입이든 키로 사용 가능하고 삽입 순서를 보장하며, Set은 중복 없는 고유값 집합입니다
3.다음 챕터에서 객체의 숨겨진 식별자 Symbol과 동작을 가로채는 Proxy를 배웁니다


공유하기
진행도 25 / 34