JavaScript Set Methods
JavaScript Set Methods: Set 객체의 메서드 정리 및 활용
JavaScript의 Set 객체는 고유한 값을 저장하는 집합으로, 중복되지 않는 값을 저장하고 관리할 수 있는 메서드들을
제공합니다. Set은 추가, 삭제, 조회, 반복 등의 작업을
쉽게 처리할 수 있게 해줍니다.
이 가이드는 JavaScript Set 객체의 주요 메서드와 그 활용 방법을 다룹니다.
1. add(): 요소 추가
add() 메서드는 Set에 새로운 요소를 추가합니다. 중복된 값이 추가될 경우 무시됩니다.
1.1. 기본 사용법
const mySet = new Set();
mySet.add(1);
mySet.add(2);
mySet.add(2); // 중복된 값은 무시됨
console.log(mySet); // 출력: Set(2) { 1, 2 }
- 특징: 값이 중복될 경우 무시되므로 고유한 값만 유지됩니다.
2. has(): 요소 존재 여부 확인
has() 메서드는 Set에 특정 값이 존재하는지 확인하여 불리언 값을
반환합니다.
2.1. 기본 사용법
const fruits = new Set(["apple", "banana", "cherry"]);
console.log(fruits.has("banana")); // 출력: true
console.log(fruits.has("grape")); // 출력: false
- 특징:
Set에 특정 값이 있는지 빠르게 확인할 수 있습니다.
3. delete(): 요소 삭제
delete() 메서드는 Set에서 특정 요소를 삭제합니다. 성공적으로 삭제되면
**true**를 반환하고, 삭제할 요소가 없으면 **false**를 반환합니다.
3.1. 기본 사용법
const numbers = new Set([1, 2, 3]);
console.log(numbers.delete(2)); // 출력: true
console.log(numbers); // 출력: Set(2) { 1, 3 }
console.log(numbers.delete(5)); // 출력: false
- 특징:
Set에서 값을 삭제하고, 삭제 성공 여부를 확인할 수 있습니다.
4. clear(): 모든 요소 제거
clear() 메서드는 Set의 모든 요소를 삭제하여 비웁니다.
4.1. 기본 사용법
const letters = new Set(["a", "b", "c"]);
letters.clear();
console.log(letters); // 출력: Set(0) {}
- 특징:
Set을 초기화하여 모든 요소를 제거할 수 있습니다.
5. size: Set의 크기 확인
size 속성은 Set에 저장된 요소의 개수를 반환합니다.
5.1. 기본 사용법
const letters = new Set(["a", "b", "c"]);
console.log(letters.size); // 출력: 3
- 특징:
Set의 요소 개수를 확인할 수 있는 속성입니다. 배열의length와 비슷한 역할을 합니다.
6. forEach(): 모든 요소에 대한 작업
forEach() 메서드는 Set의 각 요소에 대해 주어진 함수를 실행합니다. 배열의
forEach()와 유사하게 동작합니다.
6.1. 기본 사용법
const numbers = new Set([1, 2, 3]);
numbers.forEach((value) => {
console.log(value);
});
// 출력:
// 1
// 2
// 3
- 특징: 배열과 동일하게 각 요소에 대해 함수를 실행할 수 있습니다.
7. keys(), values(), entries(): 이터러블 반환
Set 객체는 키와 값이 동일하므로, keys(),
values(), entries() 모두 **이터레이터(iterator)**를 반환합니다. 이
메서드들은 순회할 때 주로 사용됩니다.
7.1. values(): 값 반환
const colors = new Set(["red", "green", "blue"]);
for (const value of colors.values()) {
console.log(value);
}
// 출력:
// red
// green
// blue
7.2. keys(): 값 반환 (Set에서는 values()와 동일)
for (const key of colors.keys()) {
console.log(key);
}
// 출력: red, green, blue (values()와 동일한 동작)
7.3. entries(): [값, 값] 쌍 반환
entries()는 Set에 있는 각 값에 대해 [값, 값] 쌍을 반환합니다. Map에서의
[키, 값] 구조와 일관성을 유지하기 위해 Set에서는 값이 키로도 반환됩니다.
for (const entry of colors.entries()) {
console.log(entry);
}
// 출력:
// [ 'red', 'red' ]
// [ 'green', 'green' ]
// [ 'blue', 'blue' ]
8. Set과 배열 변환
Set과 배열을 상호 변환하는 작업은 매우 간단합니다.
8.1. 배열을 Set으로 변환
배열을 Set으로 변환하면 중복된 값을 자동으로 제거할 수 있습니다.
const array = [1, 2, 2, 3, 4];
const uniqueSet = new Set(array);
console.log(uniqueSet); // 출력: Set(4) { 1, 2, 3, 4 }
8.2. Set을 배열로 변환
Set을 배열로 변환하려면 **Array.from()**이나 **전개 연산자(spread operator)**를 사용합니다.
const numbers = new Set([1, 2, 3, 4]);
// Array.from() 사용
const numberArray = Array.from(numbers);
console.log(numberArray); // 출력: [ 1, 2, 3, 4 ]
// 전개 연산자 사용
const numberArray2 = [...numbers];
console.log(numberArray2); // 출력: [ 1, 2, 3, 4 ]
9. Set의 활용 예시
9.1. 중복 제거
Set을 사용하면 배열에서 중복된 값을 손쉽게 제거할 수 있습니다.
const numbers = [1, 2, 2, 3, 4, 4, 5];
const uniqueNumbers = [...new Set(numbers)];
console.log(uniqueNumbers); // 출력: [ 1, 2, 3, 4, 5 ]
9.2. 교집합 구하기
두 Set 객체의 교집합을 구하는 방법입니다.
const setA = new Set([1, 2, 3, 4]);
const setB = new Set([3, 4, 5, 6]);
const intersection = [...setA].filter(x => setB.has(x));
console.log(intersection); // 출력: [ 3, 4 ]
9.3. 합집합 구하기
Set 객체의 합집합을 구하는 예시입니다.
const union = new Set([...setA, ...setB]);
console.log(union); // 출력: Set(6) { 1, 2, 3, 4, 5, 6 }
9.4. 차집합 구하기
두 집합 간의 차집합을 구하는 방법입니다.
const difference = [...setA].filter(x => !setB.has(x));
console.log(difference); // 출력: [ 1, 2 ]
요약
Set객체는 중복을 허용하지 않는 집합을 구현하며, 다양한 추가, 삭제, 조회 기능을 제공합니다.- 주요 메서드:
add(): 새로운 요소 추가has(): 특정 요소의 존재 여부 확인delete(): 특정 요소 삭제clear(): 모든 요소 삭제size:Set의 크기 반환forEach(),values(),keys(),entries(): 이터러블을 반환하거나 반복 작업을 수행
- 배열과
Set변환: 배열을Set으로 변환해 중복을 제거하고,Set을 배열로 변환할 수 있습니다.
JavaScript의 Set 객체는 데이터의 고유성을 보장
하는 작업에 매우 유용합니다. 다양한 메서드를 활용하여 중복 제거, 집합 연산 등을 쉽게 처리할 수 있습니다.