[TypeScript] Set 사용법 정리 - 중복 없는 데이터 관리

[TypeScript] Set 사용법 정리 - 중복 없는 데이터 관리

📌 TypeScript Set이란?

Set은 중복을 허용하지 않는 고유한 값들의 집합을 저장하는 자료구조입니다.
TypeScript에서 Set은 ES6 Set과 동일하게 동작하며, 유일한 값 저장, 빠른 검색 및 삭제에 적합합니다.

---

📌 1. Set 생성 및 기본 사용법

const mySet = new Set<number>(); // 숫자형 Set 생성
mySet.add(1);
mySet.add(2);
mySet.add(3);
mySet.add(2); // 중복 추가 → 무시됨

console.log(mySet); // Set { 1, 2, 3 }
console.log(mySet.size); // 3

✅ 중복된 값은 자동으로 제거됨
✅ size 속성을 사용해 요소 개수 확인 가능

---

📌 2. 요소 추가 (add())

const set = new Set<string>();
set.add("apple");
set.add("banana");
set.add("apple"); // 중복 → 추가되지 않음

console.log(set); // Set { 'apple', 'banana' }

---

📌 3. 요소 삭제 (delete())

const set = new Set([1, 2, 3]);
console.log(set.delete(2)); // true (성공적으로 삭제됨)
console.log(set.delete(5)); // false (존재하지 않는 값)
console.log(set); // Set { 1, 3 }

✅ delete()는 삭제 여부를 true / false로 반환

---

📌 4. 요소 확인 (has())

const set = new Set([10, 20, 30]);
console.log(set.has(20)); // true
console.log(set.has(40)); // false

✅ has()를 사용하면 특정 요소가 존재하는지 빠르게 확인 가능

---

📌 5. 모든 요소 삭제 (clear())

const set = new Set(["A", "B", "C"]);
set.clear();
console.log(set.size); // 0

✅ clear()를 호출하면 Set의 모든 요소가 삭제됨

---

📌 6. Set 순회 (forEach(), for...of)

const set = new Set(["A", "B", "C"]);

set.forEach((value) => {
  console.log(value);
});
// 출력: A B C

for (const value of set) {
  console.log(value);
}
// 출력: A B C

✅ forEach()와 for...of를 이용해 Set을 순회 가능

---

📌 7. Set → Array 변환 (Array.from(), 스프레드 연산자)

const set = new Set([1, 2, 3, 4]);
const arr1 = Array.from(set);
const arr2 = [...set];

console.log(arr1); // [1, 2, 3, 4]
console.log(arr2); // [1, 2, 3, 4]

✅ 배열로 변환하면 인덱스를 활용한 접근이 가능함

---

📌 8. Array → Set 변환 (new Set())

const arr = [1, 2, 2, 3, 4, 4, 5];
const uniqueSet = new Set(arr);

console.log(uniqueSet); // Set { 1, 2, 3, 4, 5 }

✅ 배열에서 중복 요소를 제거할 때 유용함

---

📌 9. Set을 활용한 유니크 배열 생성

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

console.log(uniqueNumbers); // [1, 2, 3, 4, 5]

✅ Set을 사용하면 간단하게 중복 제거 가능

---

📌 10. Set과 Map 비교

기능 Set Map

중복 허용	❌ (불가능)	✅ (가능)
요소 접근	❌ (인덱스 없음)	✅ (map.get(key))
순서 유지	❌ (보장 안됨)	✅ (입력 순서 유지)
키-값 저장	❌ (값만 저장)	✅ (키-값 저장 가능)

 

---

📌 Set 사용 시 주의점

1. 인덱스가 없기 때문에 특정 위치 요소를 직접 접근할 수 없음.

   const set = new Set([10, 20, 30]);
   console.log(set[1]); // undefined
   

2. 객체를 Set에 추가할 경우 참조(Reference) 비교가 적용됨.

   const obj1 = { id: 1 };
   const obj2 = { id: 1 };
   const set = new Set();
   
   set.add(obj1);
   set.add(obj2);
   
   console.log(set.size); // 2 (객체가 다르다고 인식됨)
   

---

📌 정리

• Set은 중복을 허용하지 않는 고유한 값의 집합을 저장하는 자료구조.
• 빠른 삽입/삭제 (O(1)) 가능하지만, 인덱스 접근은 불가능.
• Array.from(set) 또는 [...set]을 활용하여 배열로 변환 가능.
• 배열의 중복을 제거하는 용도로 유용.
• 특정 요소가 존재하는지 확인하려면 has() 사용.

✅ 이제 Set을 자유롭게 사용할 수 있겠지? 🚀 추가 질문이 있으면 알려줘! 😊