본문 바로가기
Frontend/Javascript Typescript

[Javascript] Set, Map, 배열의 차이점과 활용법

by 디스코비스킷 2025. 3. 19.
반응형

Set, Map, 배열의 차이점과 활용법

JavaScript에서는 데이터를 저장하고 관리하는 다양한 방법이 있다.
배열(Array), Set, Map은 각각 고유한 특성을 가지며, 상황에 따라 적절한 자료구조를 선택해야 한다.

1. 배열 (Array)

특징

  • 순서가 있는 데이터 구조
  • 중복 허용
  • index(숫자)를 기반으로 요소에 접근

배열 사용 예제

const arr = ["apple", "banana", "cherry", "banana"]; // 중복 허용
console.log(arr[1]); // "banana"

배열 사용 시 장점

순서가 있는 데이터 저장이 가능
index 기반 접근(arr[0])이 가능
map(), filter(), reduce() 등 강력한 배열 메서드 지원

단점

  • 중복 허용 (중복을 제거하려면 Set 필요)
  • 검색 속도가 느림 (indexOf(), includes()O(n))
  • key-value 형식 데이터 저장 불가 (Map 필요)

2. Set (집합)

특징

  • 순서가 없는 데이터 구조
  • 중복을 자동으로 제거
  • 배열보다 검색 속도가 빠름 (O(1))

Set 사용 예제

const set = new Set(["apple", "banana", "cherry", "banana"]); // 중복 제거됨
console.log(set); // Set { "apple", "banana", "cherry" }

// 값 추가
set.add("grape");
console.log(set); // Set { "apple", "banana", "cherry", "grape" }

// 값 존재 여부 확인
console.log(set.has("banana")); // true

// 값 삭제
set.delete("apple");
console.log(set); // Set { "banana", "cherry", "grape" }

// Set → 배열 변환
const arrFromSet = [...set];
console.log(arrFromSet); // ["banana", "cherry", "grape"]

Set 사용 시 장점

중복 자동 제거 (배열보다 유용함)
검색 속도가 빠름 (has()O(1))
배열로 변환 쉬움 (Array.from(set), [...set])

단점

  • 순서 보장 안 됨
  • index 기반 접근 불가능 (set[0] 사용 불가)
  • key-value 저장 불가능 (Map 필요)

3. Map (키-값 저장)

특징

  • 객체(Object)처럼 key-value 형식으로 저장 가능
  • 모든 타입의 key 사용 가능 (Object는 문자열만 가능)
  • 검색 속도가 빠름 (O(1))

Map 사용 예제

const map = new Map();

// 값 추가 (key-value)
map.set("name", "Alice");
map.set("age", 25);
map.set("job", "Developer");

console.log(map.get("name")); // "Alice"
console.log(map.get("age")); // 25

// 값 존재 여부 확인
console.log(map.has("job")); // true

// 값 삭제
map.delete("age");
console.log(map); // Map { "name" => "Alice", "job" => "Developer" }

// key-value 반복
map.forEach((value, key) => {
  console.log(key, value);
});
// name Alice
// job Developer

Map 사용 시 장점

객체보다 성능이 뛰어남 (특히 많은 데이터를 다룰 때)
모든 타입(key) 저장 가능 (Map.set(obj, value))
반복문(forEach(), for...of) 사용 용이
size 속성으로 크기 확인 가능 (map.size)

단점

  • JSON으로 변환하려면 Object.fromEntries(map) 사용 필요
  • 배열보다 메모리 사용량이 많음

Set, Map, 배열의 차이점 정리

비교 항목 배열 (Array) Set Map
데이터 구조 순서가 있는 리스트 중복 없는 집합 key-value 저장소
중복 허용 허용 불가 가능 (key 다르면 허용)
순서 유지 유지됨 보장 안 됨 key 순서 유지
index 접근 가능 (arr[0]) 불가능 불가능
검색 속도 O(n) (느림) O(1) (빠름) O(1) (빠름)
key-value 저장 불가능 불가능 가능
반복 가능 (forEach) 가능 가능 가능
사용 예 리스트, 순서가 있는 데이터 중복 제거, 빠른 검색 객체 대체, 키-값 저장

언제 어떤 자료구조를 사용해야 할까?

사용 상황 추천 자료구조
리스트를 저장하고 순서 유지해야 함 배열(Array)
중복을 자동으로 제거해야 함 Set
데이터를 key-value 형태로 저장해야 함 Map
빠른 데이터 검색이 필요함 Set 또는 Map
객체(Object)보다 더 강력한 key-value 저장이 필요함 Map
대량의 데이터에서 검색을 빠르게 하고 싶음 Set 또는 Map

결론

  1. 순서가 있는 데이터는 배열(Array)이 적합
  2. 중복을 제거해야 하면 Set 사용
  3. Key-Value 저장이 필요하면 Map 사용
  4. 검색이 많으면 SetMap이 더 빠름 (O(1))
  5. 객체(Object)는 Map보다 느릴 수 있음 (많은 데이터를 다룰 때는 Map이 유리함)

👉 배열이 기본이지만, 중복 제거는 Set, Key-Value 저장은 Map을 활용하면 더욱 최적화된 코드 작성 가능

반응형

최근댓글

최근글

© Copyright 2024 ttutta