본문 바로가기
개발

JavaScript에서 Set과 Map 활용하기: 중복 제거와 키-값 쌍 관리 전략

by hes3518 2024. 11. 17.
728x90

JavaScript Set & Map: 컬렉션 다루기

안녕하세요, 프로그래밍 세계에 발을 들인 여러분! 오늘은 JavaScript의 두 가지 중요한 컬렉션 타입, Set과 Map에 대해 알아보려고 합니다. 이 두 가지 자료 구조는 각각 고유한 특성을 지니고 있으며, 다양한 상황에서 유용하게 사용될 수 있습니다. 그럼 시작해볼까요?

Set - 중복을 허용하지 않는 컬렉션

Set은 값이 고유해야 한다는 특징을 가지고 있습니다. 예를 들어, 다음과 같이 여러 개의 값을 Set에 넣으면 중복된 값은 자동으로 제거됩니다.

const mySet = new Set([1, 2, 3, 4, 4, 5, 6, 7, 7]);
console.log(mySet); // Set(7) { 1, 2, 3, 4, 5, 6, 7 }

Set은 데이터의 중복을 허용하지 않기 때문에, 특정 데이터 구조에서 중복 요소를 제거해야 할 때 유용합니다. 예를 들어, 사용자에게 주어진 태그 중 중복된 태그를 제거하여 고유한 태그를 추출하는 데 활용될 수 있습니다.

Set 사용 사례:

  • 유저 ID: 식별자를 저장할 때 중복된 ID를 허용하지 않기 위해 Set을 사용할 수 있습니다.
  • 태그 시스템: 블로그 포스트에서 적용된 태그들을 중복 없이 저장하고 보여줍니다.

Map - 키와 값의 쌍으로 구성된 컬렉션

Map은 키와 값의 쌍으로 이루어진 데이터 구조로, 객체보다 더 유연하게 사용할 수 있습니다. 특히 키로는 객체와 같은 복잡한 데이터 타입도 사용할 수 있기 때문에 더욱 강력한 데이터 구조입니다.

const myMap = new Map();
myMap.set('name', 'John');
myMap.set('age', 30);
myMap.set('gender', 'male');

console.log(myMap.get('name')); // John
console.log(myMap.size); // 3

Map을 사용하면 각 데이터에 대한 명확한 접근이 가능하고, 데이터가 추가되거나 제거될 때에도 이에 따른 유연한 처리가 가능합니다.

Map 사용 사례:

  • 사용자 정보 관리: 사용자 ID를 키로 하여 사용자 정보를 저장할 수 있습니다.
  • 설정이나 환경 변수 관리: 다양한 설정 값을 손쉽게 관리할 수 있습니다.

Set과 Map의 차이점 요약

특징 Set Map
저장하는 요소 유일한 값만 가능 키-값 쌍
없음(값이 키의 역할) 키는 유일하며 중복이 불가능
값 접근 값으로 직접 접근 키를 통해 값에 접근
저장 순서 삽입 순서 유지 삽입 순서 유지 (ES2015)

마무리하며

JavaScript의 Set과 Map을 활용하기 통해 중복 값 처리와 키-값 쌍 데이터 관리를 입체적으로 수행할 수 있습니다. 이 두 자료 구조는 각각의 상황에 맞게 적절히 활용된다면, 여러분의 코드 품질을 높일 수 있는 강력한 동반자가 될 것입니다.

무엇보다 실무에서 사용하기 전 다양한 연습을 통해 익숙해지는 것이 중요합니다. 질문이 있으시면 언제든지 댓글로 남겨 주세요. 다음 포스트에서 또 만나요!

728x90