본문 바로가기

프로그래밍 언어/자바스크립트

JavaScript WeakMap의 기본 사용법과 활용 사례

JavaScript WeakMap의 기본 사용법과 활용 사례

JavaScript의 WeakMap 객체는 키로 객체만을 허용하며, 가비지 컬렉션과 밀접하게 연관된 특별한 자료 구조입니다. 이 글에서는 WeakMap의 특징, 장점 및 사용 사례를 설명하며, 효율적인 메모리 관리를 위해 WeakMap을 어떻게 활용할 수 있는지 알아보겠습니다.

 

 

목차

  1. WeakMap 란 무엇인가?
  2. WeakMap의 특징과 동작 원리
  3. WeakMap의 기본 사용법
  4. WeakMap 활용 사례
  5. WeakMap의 장단점
  6. 결론

 

WeakMap 란 무엇인가?

WeakMap은 JavaScript의 내장 객체로, 키-값 쌍을 저장하는 자료 구조입니다. 단, WeakMap의 키는 오직 객체만 허용하며, 가비지 컬렉션에 의해 자동으로 관리됩니다. 이러한 특성 덕분에 WeakMap은 메모리 관리에 유리하며, 특정 상황에서 효율적으로 사용할 수 있습니다.

 

 

 

WeakMap의 특징과 동작 원리

일반적인 MapWeakMap의 주요 차이점은 가비지 컬렉션키 유형에 있습니다. WeakMap의 특성을 이해하기 위해 몇 가지 주요 동작 원리를 살펴보겠습니다.

  • 객체 키만 허용: WeakMap의 키는 객체만 사용할 수 있으며, 원시값(숫자, 문자열 등)은 키로 사용할 수 없습니다.
  • 자동 가비지 컬렉션: WeakMap의 키로 참조된 객체가 다른 곳에서 더 이상 참조되지 않는 경우, 해당 객체는 메모리에서 자동으로 해제됩니다.
  • 이터러블(iterable) 지원하지 않음: WeakMap은 이터러블이 아니기 때문에 for...of 문이나 keys()와 같은 메서드를 사용할 수 없습니다.

 

 

 

WeakMap의 기본 사용법

WeakMap의 주요 메서드와 기본 사용법을 살펴보겠습니다. WeakMap은 생성, 설정, 검색, 삭제를 위해 네 가지 기본 메서드를 제공합니다.

메서드 설명 예제
set(key, value) 지정된 키와 값을 WeakMap에 추가합니다. wMap.set(obj, 'value')
get(key) 지정된 키에 연결된 값을 반환합니다. 키가 없으면 undefined를 반환합니다. wMap.get(obj)
has(key) 지정된 키가 WeakMap에 있는지 확인하여, true 또는 false를 반환합니다. wMap.has(obj)
delete(key) 지정된 키와 값을 WeakMap에서 제거합니다. wMap.delete(obj)

 

 

 

 

WeakMap 활용 사례

WeakMap은 다음과 같은 다양한 상황에서 유용하게 사용될 수 있습니다:

1. 객체 메타데이터 저장

객체와 관련된 메타데이터를 저장할 때 WeakMap을 사용하여 객체가 가비지 컬렉션 될 때 메타데이터도 자동으로 삭제되도록 할 수 있습니다.

let metaMap = new WeakMap();

let user = { name: 'Alice' };
metaMap.set(user, { accessLevel: 'admin' });

console.log(metaMap.get(user));  // { accessLevel: 'admin' }

2. DOM 요소의 추가 정보 저장

DOM 요소에 추가적인 정보를 저장하여 이벤트 리스너나 상태 관리를 쉽게 할 수 있습니다. DOM 요소가 삭제될 때 자동으로 WeakMap의 데이터도 해제됩니다.

let elementData = new WeakMap();

let div = document.createElement('div');
elementData.set(div, { clicked: false });

div.addEventListener('click', () => {
    elementData.get(div).clicked = true;
});

 

 

 

WeakMap의 장단점

WeakMap의 장단점을 간략히 요약하여 장점과 한계점 모두를 이해하고 적절한 사용법을 찾을 수 있습니다.

  • 장점:
    • 메모리 관리가 자동으로 이루어져, 객체의 메모리 해제 시 연관된 데이터도 자동 해제됨
    • 은밀한 데이터 저장에 적합하며 외부에서 직접 접근할 수 없음
  • 단점:
    • 이터러블을 지원하지 않아 키나 값을 순회할 수 없음
    • 키로 원시값을 사용할 수 없음

 

 

 

결론

WeakMap은 JavaScript에서 메모리 관리를 최적화하고 객체에 대한 비공개 데이터를 안전하게 저장하는 데 유용한 도구입니다. WeakMap의 특성과 장단점을 이해하고 적절한 사용 사례에서 활용한다면, 코드의 효율성과 안정성을 높일 수 있습니다.