:ledger: 반복 가능한 객체 iterable 객체를 알아보자

자바스크립트에는 효율적인 데이터 관리를 위한 두 가지 자료구조인 MapSet이 있다. 각각의 개념과 주요 메서드, 그리고 실무 활용 사례를 알아보자.

:one: Map 이란?

Map키-값 쌍(key-value pair)으로 데이터를 저장하는 자료 구조다. Object와 비슷하지만, 아래와 같은 차이점이 있다.

  • 키 타입: Map의 키는 객체를 포함한 모든 값을 사용할 수 있다.
  • 순서 보장: 삽입된 수선대로 데이터가 저장된다.
  • 메서드: 다양한 내장 메서드로 효율적인 데이터 작업이 가능하다.

:pushpin: 1-1) 사용법

const map = new Map();
// 데이터 추가
map.set("name", "John");
map.set("age", 30);
map.set({ id: 1 }, "User 1");

// 데이터 조회
console.log(map.get("name")); // "John"
console.log(map.has("age")); // true

// 데이터 삭제
map.delete("age");

// 전체 데이터 확인
console.log(map.size); // 2

:pushpin: 1-2) 주요 메서드

메서드 설명
set(key, value) 키-값 쌍 추가
get(key) 키에 해당하는 값 반환
has(key) 키가 존재하는지 확인
delete(key) 특정 키 삭제
clear() 모든 데이터 삭제
size (속성) 저장된 키-값 쌍의 개수

:two: Set 이란?

Set고유 값(unique values)의 집합을 저장하는 자료구조다. 배열과 비슷하지만, 중복 값이 자동으로 제거된다.

:pushpin: 2-1) 사용법

const set = new Set();

// 데이터 추가
set.add(1);
set.add(2);
set.add(2); // 중복값은 추가되지 않음
set.add("hello");

// 데이터 조회
console.log(set.has(1)); // true
console.log(set.has(3)); // false

// 데이터 삭제
set.delete(2);

// 전체 데이터 확인
console.log(set.size); // 2

:pushpin: 2-2) 주요 메서드

메서드 설명
add(value) 값을 추가
has(value) 값이 존재하는지 확인
delete(value) 특정 값을 삭제
clear() 모든 값 삭제
size (속성) 저장된 값의 개수

:three: Map과 Set 실무 활용 사례

:pushpin: 3-1) 데이터 매핑 (Map)

Map은 객체 키를 효율적으로 관리할 때 유용하다. 예를 들어, 사용자 데이터를 ID 기반으로 저장한다.

const userMap = new Map();
userMap.set(1, { name: "Alice", age: 25 });
userMap.set(2, { name: "Bob", age: 30 });

console.log(userMap.get(1)); // { name: "Alice", age: 25 }

:pushpin: 3-2) 중복 제거 (Set)

배열에서 중복된 데이터를 제거하거나 고유 값을 유지해야 할 때 유용하다.

const numbers = [1, 2, 2, 3, 4, 4, 5];
const uniqueNumbers = [...new Set(numbers)];
console.log(uniqueNumbers); // [1, 2, 3, 4, 5]

:pushpin: 3-3) 교집합 구하기

두 배열간의 공통 요소를 찾는데 사용 가능하다.

const setA = new Set([1, 2, 3, 4]);
const setB = new Set([3, 4, 5, 6]);

const intersection = [...setA].filter((value) => setB.has(value));
console.log(intersection); // [3, 4]

:fire: 회고

MapSet은 효율적인 데이터 관리와 작업을 가능하게 해주는 강력한 도구다. 특히 실무에서 데이터 매핑이나 중복 제거를 다룰 때 많이 사용되는 것 같다.

:pushpin: 참고 문서

태그: ,

카테고리: ,

업데이트: