Javascript & Typescript

자바스크립트의 Set 객체와 새로운 메서드들

0

자바스크립트의 Set 객체는 유일한 값들의 컬렉션을 제공하여 중복된 항목을 제거하는데 유용한 도구입니다. 최근 Firefox 127 버전 업데이트로 새로운 Set 메서드들이 추가되었는데요, 이제 다양한 브라우저에서 이 메서드들을 사용할 수 있게 되었습니다. 새로운 메서드들은 개발자들이 더 쉽고 효율적으로 Set 객체를 다룰 수 있도록 도와줍니다. 여기서는 새롭게 추가된 메서드들의 기능과 사용법에 대해 자세히 알아보겠습니다.


새로운 Set 메서드 개요

Set 객체에 추가된 새로운 메서드들은 다음과 같습니다:

  • intersection()
  • union()
  • difference()
  • symmetricDifference()
  • isSubsetOf()
  • isSupersetOf()
  • isDisjointFrom()

이 메서드들은 Set 객체를 더 유연하고 강력하게 만들어 줍니다. 각 메서드가 무엇을 하는지 간단히 살펴보겠습니다.

1. intersection()

`intersection()` 메서드는 두 Set의 공통 요소를 새로운 Set으로 반환합니다.

const setA = new Set([1, 2, 3]);
const setB = new Set([2, 3, 4]);
const intersectionSet = setA.intersection(setB);
console.log(intersectionSet); // Set { 2, 3 }

2. union()

`union()` 메서드는 두 Set의 모든 요소를 포함하는 새로운 Set을 반환합니다.

const setA = new Set([1, 2, 3]);
const setB = new Set([2, 3, 4]);
const unionSet = setA.union(setB);
console.log(unionSet); // Set { 1, 2, 3, 4 }

3. difference()

`difference()` 메서드는 첫 번째 Set에는 있지만 두 번째 Set에는 없는 요소들을 새로운 Set으로 반환합니다.

const setA = new Set([1, 2, 3]);
const setB = new Set([2, 3, 4]);
const differenceSet = setA.difference(setB);
console.log(differenceSet); // Set { 1 }

4. symmetricDifference()

`symmetricDifference()` 메서드는 두 Set 중 한쪽에만 있는 요소들을 새로운 Set으로 반환합니다.

const setA = new Set([1, 2, 3]);
const setB = new Set([2, 3, 4]);
const symmetricDifferenceSet = setA.symmetricDifference(setB);
console.log(symmetricDifferenceSet); // Set { 1, 4 }

5. isSubsetOf()

`isSubsetOf()` 메서드는 현재 Set의 모든 요소가 다른 Set에 포함되어 있는지 확인하여 불리언 값을 반환합니다.

const setA = new Set([1, 2]);
const setB = new Set([1, 2, 3]);
console.log(setA.isSubsetOf(setB)); // true

6. isSupersetOf()

`isSupersetOf()` 메서드는 현재 Set가 다른 Set의 모든 요소를 포함하고 있는지 확인하여 불리언 값을 반환합니다.

const setA = new Set([1, 2, 3]);
const setB = new Set([1, 2]);
console.log(setA.isSupersetOf(setB)); // true

7. isDisjointFrom()

`isDisjointFrom()` 메서드는 두 Set이 공통 요소를 가지고 있지 않은지 확인하여 불리언 값을 반환합니다.

const setA = new Set([1, 2]);
const setB = new Set([3, 4]);
console.log(setA.isDisjointFrom(setB)); // true

새로운 메서드의 중요성

이 메서드들은 개발자들에게 큰 편리함을 제공합니다. 예를 들어, 중복된 요소를 쉽게 제거하고 두 Set 간의 관계를 명확히 파악할 수 있습니다. 이는 대용량 데이터 처리나 복잡한 데이터 구조를 다룰 때 특히 유용합니다.

// 예시: 유니크한 사용자 목록 생성
const onlineUsers = new Set(['Alice', 'Bob', 'Charlie']);
const offlineUsers = new Set(['Bob', 'Charlie', 'David']);

// 온라인 또는 오프라인에 있는 모든 사용자
const allUsers = onlineUsers.union(offlineUsers);
console.log(allUsers); // Set { 'Alice', 'Bob', 'Charlie', 'David' }

// 온라인과 오프라인에 모두 있는 사용자
const commonUsers = onlineUsers.intersection(offlineUsers);
console.log(commonUsers); // Set { 'Bob', 'Charlie' }

// 온라인에만 있는 사용자
const onlyOnlineUsers = onlineUsers.difference(offlineUsers);
console.log(onlyOnlineUsers); // Set { 'Alice' }

// 온라인 또는 오프라인에만 있는 사용자
const uniqueUsers = onlineUsers.symmetricDifference(offlineUsers);
console.log(uniqueUsers); // Set { 'Alice', 'David' }

이처럼 Set 객체와 새로운 메서드들은 데이터를 효과적으로 관리하고 조작하는 데 강력한 도구가 됩니다. 이를 통해 복잡한 문제를 간단하고 명확하게 해결할 수 있습니다.

결론

자바스크립트 Set 객체의 새로운 메서드들은 개발자들에게 많은 이점을 제공합니다. 이 메서드들을 통해 데이터를 더 효율적으로 관리하고 조작할 수 있으며, 다양한 상황에서 유용하게 사용할 수 있습니다. 새로운 메서드들을 익히고 활용하여 개발 작업을 더욱 간편하고 효과적으로 진행해 보세요!

참고 자료: MDN Web Docs, “JavaScript Set Methods”

답글 남기기